15年软件开发经验 只做源码定制 互联网+定制化解决方案

15年软件开发经验,只做源码定制!

原创设计 定制开发

满足您的个性化需求

当前位置:首页 前端开发 CSS

滚动条

王永康| 发布于 2021-07-19 21:41:21| 616阅读| 0点赞| 0评论
举报

div 添加滚动条只需要指定 overflow 属性为 auto 即可

::-webkit-scrollbar 滚动条整体部分

::-webkit-scrollbar-thumb  滚动条里面的小方块,能向上向下移动(或往左往右移动,取决于是垂直滚动条还是水平滚动条)

::-webkit-scrollbar-track  滚动条的轨道(里面装有Thumb)

::-webkit-scrollbar-button 滚动条的轨道的两端按钮,允许通过点击微调小方块的位置。

::-webkit-scrollbar-track-piece 内层轨道,滚动条中间部分(除去)

::-webkit-scrollbar-corner 边角,即两个滚动条的交汇处

::-webkit-resizer 两个滚动条的交汇处上用于通过拖动调整元素大小的小控件

 <div class="one">
        <div class="one2"></div>
    </div>
 .one{width:100px;height:100px;background:red;padding:20px;}
        .one2{width:80px;height:200px;background:green;}

没加任何样式


当子元素的宽高大于父元素时,通常会给父元素添加overflow:hidden;来显示超出部分隐藏,但当加上overflow-y:auto,就会出现一个垂直滚动条

.one{width:100px;height:100px;background:red;padding:20px;overflow-y:auto;}


当宽度大于父元素宽度时,可以给父元素添加水平滚动条

.one{width:100px;height:100px;background:red;padding:20px;overflow-x:auto;}

0

0条评论

别默默看啦~登录/注册一起参与讨论吧~

热门标签

王永康
微信扫一扫立即咨询
账号登录|扫码登录

立即注册 |忘记密码?

欢迎注册

已有账号马上登录

重置密码

扫码绑定微信
微信扫一扫

绑定手机号

分享到-微信

举报

  • 举报类型:

  • 举报描述:

您好,当前积分不足。

在线客服
拨打电话
17330196230 13230981129
顶部