有的时候,我们可能需要在网页页面中嵌入框架页面,嵌入之后可能会由于框架页面中的页面过宽而会出现横向(水平)滚动条的现象,这样非常不便于浏览者的习惯,我们往往习惯于垂直滚动条,所以在这里向大家介绍一种框架网页中去掉横向(水平)滚动条的方法。
框架代码如下:
<iframe id="htmer" src="htmer.htm" frameborder="0"scrolling="auto" noresize="noresize" width="800" height="600"></iframe>
其实从上面的框架代码中就可以了解到,只要htmer.htm文件中的宽度不超过800就不会出现横向滚动条,于是我在htmer.htm中设置宽度为100%,然后在Firefox下面是正常的,但是在IE上运行总是有一个横向的滚动条,于是在网上寻找答案,找到了解决方法。
用CSS来解决,代码如下:
body { overflow: scroll; overflow-x: hidden; overflow-x: auto !important; }
结果测试失败,而我把上面的CSS样式中的body{…}改为html{…}却成功了。即改为如下代码:
html{ overflow: scroll; overflow-x: hidden; overflow-x: auto !important; }
经过我的反复测试得出的结论是只有在不声明DTD(即在网页头部声明的那串代码,用Dreamweaver新建的网页会自动加上那串代码)的时候body{}和htm{}才是都可以的,声明了DTD的情况下,只有html{}是可以的。