css overflow-x: scroll 滚动不展示/隐藏滚动条 /如何滚动

overflow-x:scroll 实现滚动效果

复制代码
.scroll{
		width: 300rpx;
		height: 100rpx;
        //超出部分隐藏
		overflow-x: hidden;
        //禁止换行
		white-space: nowrap;
        //显示滚动条
		overflow-x: scroll;
}

操作滚动条的伪类元素

复制代码
    ::-webkit-scrollbar --- 整个滚动条.
    ::-webkit-scrollbar-button --- 滚动条上的按钮 (上下箭头).
    ::-webkit-scrollbar-thumb --- 滚动条上的滚动滑块.
    ::-webkit-scrollbar-track --- 滚动条轨道.
    ::-webkit-scrollbar-track-piece --- 滚动条没有滑块的轨道部分.
    ::-webkit-scrollbar-corner --- 当同时有垂直滚动条和水平滚动条时交汇的部分.
    ::-webkit-resizer --- 某些元素的corner部分的部分样式(例:textarea的可拖动按钮).
相关推荐
小天呐6 分钟前
qiankun 微前端接入实战
前端·js·微前端
周航宇JoeZhou12 分钟前
JP4-7-MyLesson后台前端(五)
java·前端·vue·elementplus·前端项目·mylesson·管理平台
Yaavi15 分钟前
一个基于markdown的高性能博客模板
前端·开源·源码
艾小码33 分钟前
手把手教你实现一个EventEmitter,彻底告别复杂事件管理!
前端·javascript·node.js
幸福摩天轮43 分钟前
npm发布包
前端
前端AK君1 小时前
Gitlab 线上合并冲突的坑
前端
ze_juejin1 小时前
ES6 Module 深入学习
前端
章丸丸1 小时前
Tube - Studio Videos
前端·后端
因吹斯汀2 小时前
一饭封神:当AI厨神遇上你的冰箱,八大菜系大师在线battle!
前端·vue.js·ai编程
心一信息2 小时前
ThreeJS骨骼示例
css·css3·html5