常用 CSS 代码片段集合，建议收藏 分享日常开发过程中遇到的常见CSS代码，来看看有没有你熟悉的代码，相信这么多的场景能为你节省一些些时间，建议收藏起来，说不定哪天就用上啦～ overscroll-behavior-x 内部盒子滚动到边界的时候，将触发整个页面滚动，可通过设置阻止此行为 使用 sroll-snap-type 优化滚动 在实际应用中，应用在全屏滚动或banner上有很多用武之地，不需要原始的各种尺寸位置计算 横竖虚线 css自带的虚线在某些设计场景下不够用，通过绘制虚线。 画格子 基于 渐变画格子，格子的角度及条纹之间的间隙可自行调整。 
改变输入框光标的颜色 解决IOS滚动条卡顿 隐藏滚动条 webkit下修改滚动条样式 ::-webkit-scrollbar 滚动条整体部分::-webkit-scrollbar-button 滚动条两端的按钮:-webkit-scrollbar-track 外层轨道::-webkit-scrollbar-track-piece 内层滚动区::-webkit-scrollbar-thumb 滚动的滑块::-webkit-scrollbar-corner 边角::-webkit-resizer 定义右下角拖动块的样式 开启硬件加速 开启了3D模式后的 过渡在IOS中闪屏，卡顿，可设置开启硬件加速解决 在webkit内核的浏览器中，另一个行之有效的方法是 清除浮动 文本溢出显示省略号 单行文本溢出，定义ellipsis函数方便调用 多行文本溢出，定义multi-ellipsis函数方便调用，line是对应的行数 使用:not() 解决最后一个素特殊样式 让列表项看上去像一个真正的用逗号分隔的列表 安卓CSS不识别边框0.5px解决办法 CSS3 nth-child()选择器 1、选择列表中的偶数标签 :nth-child(2n) 2、选择列表中的奇数标签 :nth-child(2n-1) 3、选择从第6个开始的，直到最后:nth-child(n+6) 4、选择第1个到第6个 :nth-child(-n+6) 5、两者结合使用，可以限制选择某一个范围，选择第6个到第9个 :nth-child(n+6):nth-child(-n+9) 禁止文字选中 显示链接名称的同时并显示当前URL 当a标签没有文本值，但 href 属性有链接的时候显示链接 利用border实现三角形 要实现不同方向的三角形改变其border的代码，三角形底部对应两侧的颜色为透明。 图片灰度滤镜 自定义选中文本颜色 禁用鼠标事件 参考 使用 sroll-snap-type 优化滚动overscroll-behavior-x 「专注前端开发，分享前端相关技术干货，：南城大前端（ID: nanchengfe）」
2024最新激活全家桶教程，稳定运行到2099年，请移步至置顶文章：https://sigusoft.com/99576.html
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。 文章由激活谷谷主-小谷整理,转载请注明出处：https://sigusoft.com/59789.html
