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的可拖动按钮).
相关推荐
OpenTiny社区4 小时前
TinyEngine 2.11版本发布:AI 进一步融入画布,Vue 工程可一键转DSL
前端·vue.js·github
小雪_Snow4 小时前
JavaScript 中的三种常用事件
开发语言·前端·javascript
Hyyy4 小时前
Electron-Vite是什么,和Vite有什么区别
前端·面试
梨想橙汁5 小时前
CSS零基础入门:语法、引入方式与基础样式全解析
css
蓝胖子酱5 小时前
在 Electron 中用 electron-store 实现加密存储与自定义格式文件
前端·javascript·数据库
虚焦像素_5 小时前
海康 Web 插件版接入指南:用法与注意事项
前端
虚焦像素_5 小时前
海康 Web 无插件版接入指南:用法与注意事项
前端
aaron6 小时前
前端演进史:当你没留意时,前端发生了什么
前端
不好听6136 小时前
前端路由完全指南(上篇):从原理到 6 种路由模式
前端·react.js
像我这样帅的人丶你还6 小时前
🚀大文件上传的那些事
前端·javascript·架构