随着前端框架的崛起 各种组件化 模块化开发 然而我发现在PC端要考虑兼容 ~~~~
自己琢磨着 在PC端怎么吧一个页面做成一个公共的部分 发现有个iframe标签可以在页面中嵌套
虽然iframe可以做成公共部分 但问题也是很多（PS：百度）
<iframe src="../home/home.html" id="cont" frameborder="0" scrolling="no" width="100%" height="100%;"></iframe>
<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 { width: 100%; height: 100%; /*第二种解决方案*/ /*vertical-aglin:top;*/ /*第三种解决方案*/ /*display:block;*/ } 这里我使用的是第一种方式 效果非常好 能解决问题！