继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

CSS滚动条样式设置

慕妹3242003
关注TA
已关注
手记 248
粉丝 9
获赞 25

概述

最近项目中需要,将一个页面嵌入在一个webbrower中,这个webrower是定高的,在页面内容超过webbrower高度时,需要以滚动条的形式展现,当时也考虑了使用webbrower的滚动条,但是无法获取页面的实际高度,就放弃了,而是采用给页面的div加滚动条的方式。

滚动条css

在任何情况下,如果网页超出显示范围,就会出现滚动条。但有时我们并不想让它显示,如何隐藏它呢?只需在<body></body>之间插入代码:

<body style="overflow-x:hidden;overflow-y:hidden">

即可。其中x表示水平滚动条,将其改为y的话就可以隐藏垂直滚动条。

滚动条各条语句含义如下:

复制代码

Crollbar-Face-color:滚动条页面颜色设定;Scrollbar-Highlight-Color:滚动条斜面和左面颜色设定;
Scrollbar-Shadow-Color:滚动条下斜面和右面颜色设定;Scrollbar-3Dlight-Color:滚动条上边和左边的边沿颜色设定;
Scrollbar-Arrow-Color:滚动条两端箭头颜色设定;Scrollbar-Track-Color:滚动条底版颜色设定;
Scrollbar-Darkshadow-Color:滚动条下边和右边的边沿颜色设定

复制代码

总结

最近项目中,虽然涉及到样式,但是也是自己一点一点扣出来的,如果让我选择的话,我宁愿去写js也不想弄样式,有时候就为了那1px的差异,你丫是调不出来。

打开App,阅读手记
2人推荐
发表评论
随时随地看视频慕课网APP