javascript,html5_移动网站里面后台嵌入第三方文章，样式会互相影响，怎么解决互不影响？，javascript,html5,css

移动网站里面后台嵌入第三方文章，样式会互相影响，怎么解决互不影响？

做一个移动网站顶部和底部是当前网站，做了自适应，嵌入第三方网站文章(包括html,样式和自适应)，这样两种样式和适配不一样，怎么做才能不会互相影响?

用iframe可以解决，可以参考一下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    <title>Document</title>
    <style>
        *{margin: 0;padding: 0;}
        html,body,.con{width: 100%;height: 100%;overflow: hidden;}
        .con{display: -webkit-box;-webkit-box-orient:vertical;}
        header,footer{height: 40px;background: #f00;}
        iframe{-webkit-box-flex:1;display: block;}
    </style>
</head>
<body>
    <div class="con">
        <header>头部</header>
        <iframe src="http://www.baidu.com" frameborder="0"></iframe>
        <footer>底部</footer>
    </div>
</body>
</html>

弄成图片??把第三方文章内容抽取出来。。