外层div无滚动条（overflow: hidden;）
里层div有滚动条（overflow: auto;）
然后把里层的偏移一下，使滚动条看不见
具体例子看我这里写的
>
按住shift横向滚动。
至于偏移多少距离，可以用js算出滚动条的宽度，或者你干脆就像我上面写的一样，用20px，目前我没看到什么浏览器的默认滚动条样式是超过20px的。
js计算滚动条宽度的方法，参考一下，可能IE8有兼容问题，自己改一下吧
获取滚动条宽度
@returns {number}
/
function getScrollBarWidth() {
var oP = documentcreateElement('p');
oPstylewidth = '100px';
oPstyleheight = '100px';
oPstyleoverflowY = 'scroll';
documentbodyappendChild(oP);
var scrollBarWidth = oPoffsetWidth - oPclientWidth;
oPparentNoderemoveChild(oP);
return scrollBarWidth;
}
解决方法如下：
1，把body标签的样式（滚动条）禁用。
2，div标签的样式（滚动条）启用。
<html><head><style>body{ overflow:hidden;}test{ width:100px; height:100px; overflow:auto;}</style></head><body><div class="test"> DIV内容区域，当内容超出该DIV范围时出现滚动条 DIV内容区域，当内容超出该DIV范围时出现滚动条 DIV内容区域，当内容超出该DIV范围时出现滚动条 DIV内容区域，当内容超出该DIV范围时出现滚动条 DIV内容区域，当内容超出该DIV范围时出现滚动条</div></body></html>。
固定滚动条的方法：
1、html,body：将默认出现的滚动条，完全地隐藏，这样不管什么内容都不会出现了。
2、virtual_body：写一个假的body，设置它的长宽为100%，这样利用可视的浏览器窗体显示所有的内容，并垂直允许出现滚动条。
3、fixed_div：用它进行绝对值进行定位，因为在这个容器下，该页面100%的被假冒body覆盖了，滚动条自然也显示不出来了。
body里面加<style
type="text/css">
body{
overflow:scroll;
overflow-x:hidden;
}
</style>
这个是y轴有滚动条，x轴没有。如果是都要滚动条就去掉overflow-x:hidden;，如果是反正哪个轴要滚动条就加上overflow-x/y:scroll;整个页面滚动条就加在body里面，div里面出现滚动条就加在div里面。溢出隐藏，写两个div，高度都固定，外面的固定宽度overflow:
hidden;里面的div宽度比外面的稍宽，最好算好滚动条的宽度，overflow-y:
auto即可
------------------------------------------------
我是内容
-----------------------------------------------有三种代码输入的方式可以在CSS隐藏滚动条。
详细方法如下：
方法一:
代码如下:
html
{
overflow-y:
scroll;
}
原理：强制显示ie的垂直滚动条，而忽略水平滚动条；
优点：完全解决了这个问题,
允许你保持完整的XHTML
doctype；
缺点：即使页面不需要垂直滚动条的时候也会出现垂直滚动条；
方法二:(推荐采用)
代码如下:
html
{
overflow-x:
hidden;
overflow-y:
auto;
}
原理：隐藏横向滚动，垂直滚动根据内容自适应；
优点：在视觉上解决了这个问题在不必要的时候,
未强制垂直滚动条出现；
缺点：只是隐藏了水平滚动条，如果页面真正需要水平滚动条的时候，屏幕以外的内容会因为用户无法水平滚动，而看不到；
方法三:
代码如下:
body
{
margin-right:
-15px;
margin-bottom:
-15px;
}
原理：这会在margin的水平和垂直方向上添加一个负值,
IE添加了该精确数值后,
便会去除对滚动条的需求假象；
优点：在视觉上解决了这个问题，垂直滚动根据内容自适应；
缺点：由于"人为创建"了15px的外边距(margin),
所以无法使用该填充过的屏幕区域。overflow-x:hidden;这是隐藏横向滚动条的
overflow-y:hidden;这是隐藏垂直滚动条的
overflow:hidden;这个全部隐藏。前提是你要固定width和height。方案1：设置2个DIV层，A1外层，A2内层，A2的宽度设置比A1宽20px左右（大概就是滚动条的宽度），A2设置为可见滚动条，A1设置为隐藏滚动条。
可以滚动，但是看不到滚动条。前提是你必须在页面载入的时候将鼠标焦点对准到A2层上，如果焦点在A2层外，滚轮和下建无效。这个可以用js很容易做到。
方案2：直接把滚动条颜色设置和背景层一样。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）