iframe标签在PC端的使用

随着前端框架的崛起各种组件化模块化开发然而我发现在PC端要考虑兼容 ~~~~

自己琢磨着在PC端怎么吧一个页面做成一个公共的部分发现有个iframe标签可以在页面中嵌套

虽然iframe可以做成公共部分但问题也是很多（PS：百度）

<iframe src="../home/home.html" id="cont" frameborder="0" scrolling="no" width="100%" height="100%;"></iframe>

　用法就是这么简单需要一个需要一个src页面地址 frameborder设置iframe边框为空 scrolling清除滚动条我这里设置嵌套进去的页面宽高为100%

这里有个问题就是高度如果设置为100% 页面就会出现2个滚动条或者当你iframe里面的高度大于屏幕高度嵌套进去也会出现2条滚动条

我自己的解决办法就是百度拉~~~~ 记录下代码以后用的到

下面贴下前端前辈的代码一共有3种解决办法

<div>
  <iframe frameborder="no" src="https://www.oschina.net/">
  </iframe>
</div>

html,
body {
  height: 100%;
  padding: 0;
  margin: 0;
}

div {
  height: 100%;
  /*第一种解决方案*/
  /*font-size:0;*/

}

iframe {
   100%;
  height: 100%;
  /*第二种解决方案*/
  /*vertical-aglin:top;*/
  /*第三种解决方案*/
  /*display:block;*/
}

　　这里我使用的是第一种方式效果非常好能解决问题！