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的可拖动按钮).
相关推荐
汪汪队长1 小时前
谷歌浏览器自定义油猴插件
前端
ZFSS1 小时前
SeeDance Tasks API 的对接和使用
前端·人工智能
睿智的仓鼠1 小时前
🦞OpenClaw 快速部署及使用指南
前端·人工智能
前端付豪1 小时前
Nest 项目小实践之图书增删改查
前端·node.js·nestjs
比特鹰1 小时前
手把手带你用Flutter手搓人生K线
前端·javascript·flutter
奔跑路上的Me1 小时前
前端导出 Word/Excel/PDF 文件
前端·javascript
bluceli1 小时前
JavaScript异步编程深度解析:从回调到Async Await的演进之路
前端·javascript
会员源码网1 小时前
告别参数混乱:如何优雅解决方法参数过多导致的可维护性难题
css
青青家的小灰灰1 小时前
Vue 3 新标准:<script setup> 核心特性、宏命令与避坑指南
前端·vue.js·面试
SuperEugene1 小时前
路由与布局骨架篇:布局系统 | 头部、侧边栏、内容区、面包屑的拆分与复用
前端·javascript·vue.js