百科滚动条

最新推荐文章于 2021-10-09 22:37:31 发布

靖翼

最新推荐文章于 2021-10-09 22:37:31 发布

阅读量174

点赞数

分类专栏：前端

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

去掉水平滚动条：

<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

靖翼

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
百科滚动条

去掉水平滚动条：<body style="overflow-x: hidden">去掉竖直滚动条：<body style="overflow-y: hidden">隐藏横向滚动条，显示纵向滚动条:<body style="overflow-x:hidden;overflow-y:scroll">全部隐藏<body style="over...
复制链接

扫一扫

专栏目录