一:正常情況下可以用css樣式實現自適應
style代碼
<style type="text/css">
iframe{
width:100%;
height: 100%;
}
</style>
html代碼
<iframe src="http://www.baidu.com" id="thisIframe" scrolling="no" frameborder="0"></iframe>
二:但是有時候並不能用一的方法,樣式衝突吧,可以用以下方式進行自適應
以下代碼出處 https://jingyan.baidu.com/article/b87fe19eaeb2cf5218356896.html
<div id="leamain">
<iframe src="#" marginheight="0" marginwidth="0" frameborder="0" scrolling="no" width="765" height=100% id="iframepage" name="iframepage" onLoad="iFrameHeight()" ></iframe>
<script type="text/javascript" language="javascript">
function iFrameHeight() {
var ifm= document.getElementById("iframepage");
var subWeb = document.frames ? document.frames["iframepage"].document :
ifm.contentDocument;
if(ifm != null && subWeb != null) {
ifm.height = subWeb.body.scrollHeight;
}
}
</script>
</div>
以上親測,ie、火狐、谷歌等瀏覽器均沒問題,希望對你有用。