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的可拖动按钮).
相关推荐
超级无敌暴龙兽7 小时前
和我一起刷面试题呀
前端·面试
wzl202612137 小时前
企业微信定时群发技术实现与实操指南(原生接口+工具落地)
java·运维·前端·企业微信
小码哥_常7 小时前
Robots.txt:互联网爬虫世界的“隐形规则”
前端
小码哥_常8 小时前
Android开发神器:AndroidAutoSize,轻松搞定屏幕适配
前端
前端一小卒8 小时前
前端工程师的全栈焦虑,我用 60 天治好了
前端·javascript·后端
不停喝水8 小时前
【AI+Cursor】 告别切图仔,拥抱Vibe Coding: AI + Cursor 开启多模态全栈新纪元 (1)
前端·人工智能·后端·ai·ai编程·cursor
coderyi9 小时前
LLM Agent 浅析
前端·javascript·人工智能
科雷软件测试9 小时前
使用python+Midscene.js AI驱动打造企业级WEB自动化解决方案
前端·javascript·python
ConardLi10 小时前
把 Claude Design 做成 Skill,你的网站也能拥有顶级视觉体验
前端·人工智能·后端