网页的横向滚动条

body {
overflow: scroll;
overflow-x: hidden;
overflow-x: auto !important;
}

而我测试的结果是失败的,而我把上面的CSS样式中的body{…}改为htm{…}却成功了。经过我的反复测试得出的结论是只有在不声明DTD的时候body{…}和html{…}才是都可以的,声明了DTD的情况下,只有html{…}是可以的

众所周知,标准网页设计一般不能出现横向滚动条,这是由网页美观,易用性等多方面决定的。
而现在主流设计还都是针对800*600分辨率设计的。在这可怜的800像素宽里,设计师既要考虑到最大限度表现出文字与图片,还要为了美观来美化表格、 增加质感和效果。真可谓是每像素必争(至少我是这样),所以经常会有朋友问,到底800*600分辨率下,想要不出现横向滚动条,网页到底可以做多宽?

答案很简单:779像素。(在800*600分辨率下,windows外观为系统默认,ie窗口最大化,页面属性左右两侧边距为0像素)

· windows默认情况下,滚动条宽度为17像素。

· windows默认情况下,活动窗口边框宽为1像素,但是windows为了增加效果,会再有1像素宽的阴影,所以一共是2像素。

· 右侧窗口边框2像素+滚动条17像素=19像素,再加上左侧窗口边框一共是21像素。

· 在浏览器中实际测试,779宽度不产生横向滚动条。

具体设计时,一般为了考虑内容居中和方便计算,大多采用双数,所以778是最佳尺寸。知道这个的原理,1024或1280的也都可以轻松算出来了。

===========================================================================

  1、在IE6.0下,宽度为显示器分辨率减21,比如1024的宽度-21就变成1003。但值得注意的是IE6.0(或更低)无论你的网页多高都会有右侧的滚动条框。

  2、在Firefox下,宽度的分率辨减19。比如1024的宽度-19就变成1005

  3、在Opear下,宽度的分率辨减23。比如1024的宽度-23就变成1001

  注:Firefox或Opear在内容少于浏览器高度时不显示右侧滚动条。

  所以如果是1024的分辨率,你的网页不如设成1000安全一点。如果是800的分辨率一般都设成770。

  这些需要明白并且牢记,不然很可能做出来的东西不符合浏览器要求。不过一般我们都回设定的再稍微小一点,应为有些浏览器加了插件或者其他的东西宽度会有变化,所以800的分辨率一般设定760左右;1024的设定990左右

经验可以积累,但梦想永远不能磨灭
原文地址:https://www.cnblogs.com/lancee/p/2111278.html