去掉水平滚动条:
<body style="overflow-x: hidden">
去掉竖直滚动条:
<body style="overflow-y: hidden">
隐藏横向滚动条,显示纵向滚动条:
<body style="overflow-x:hidden;overflow-y:scroll">
全部隐藏
<body style="overflow:hidden">
或者是
<body scroll="no">
如果利用上面的方法不能去除滚动条,可以考虑以下的办法:
<style>
html { overflow-x:hidden; }
</style>
如果想隐藏垂直滚动条:
<style>
html { overflow-y:hidden; }
</style>
简单介绍一下滚动条的属性代码:
overflow-y : visible | auto | hidden | scroll
visible : 不剪切内容也不添加滚动条。
auto : 在需要时剪切内容并添加滚动条
hidden : 不显示超过对象高度的内容
scroll : 总是显示纵向滚动条
下面说一下添加滚动条的方法:
overflow-y : auto;height:多少px
auto
就是自动判断要不要加入滚动条,当设定的对象内容超过了height设定的高度时,就自动添加滚动条,不然则不显示,body{}中的默认值就是
overflow-y : auto;height:浏览器高度,所以当网页内容超过浏览器高度的时候,浏览器右边就会自动显现出滚动条来
大家如
果需要设置这个的话,本人建议设置在最新评论#m_comment{}、文章列表#m_blog{}等内容和高度都不固定的模版中,有的朋友找不到这些模
版的ID,可能只有例如#m_comment div.item{}或者#m_pro a{}等的ID,那么可以自己加上没有的ID,这样就可以设置了
这里还有另一个添加滚动条的方法:
overflow-y :scroll
如果只加这个参数的话,虽然滚动栏会显示,但是不会显示滚动条,所以必须还要加上一个height:多少px高度属性,跟上面的那个方法差不多,但是有根本的区别,这个无论对象内容的高度是否超过了height设定的高度,滚动栏永远都会显示在边上的
下面我们说一下关于滚动条的美化,我们先说一下美化的各个属性:
SCROLLBAR-FACE-COLOR: 颜色代码;
SCROLLBAR-HIGHLIGHT-COLOR:颜色代码;
SCROLLBAR-SHADOW-COLOR: 颜色代码;
SCROLLBAR-3DLIGHT-COLOR: 颜色代码;
SCROLLBAR-ARROW-COLOR: 颜色代码;
SCROLLBAR-TRACK-COLOR: 颜色代码;
SCROLLBAR-DARKSHADOW-COLOR: 颜色代码;
具体效果还请大家自己去实现吧
参考网址:https://blog.csdn.net/qq_34893326/article/details/78664572