关于::-webkit-scrollbar不生效的问题,这通常与几个关键因素有关。我将根据提供的提示逐一分析和解答: 1. 检查CSS选择器和属性是否正确应用 首先,确保你的CSS选择器::-webkit-scrollbar及其子伪元素(如::-webkit-scrollbar-thumb)正确无误。::-webkit-scrollbar是一个非标准的CSS伪元素,用于修改Webkit引擎(如Ch...
对于苹果手机（iOS）上的滚动条样式修改，由于苹果限制了对滚动条的自定义能力，所以无法直接通过 CSS 来...
开发者工具里显示正常 真机看就不行了 .popup::-webkit-scrollbar {/*滚动条整体样式*/ width: 7px; } .popup::-webkit-scrollbar-thumb {/*滚动条里面小方块*/ background: #1f1f20; } .popup::-webkit-scrollbar-track {/*滚动条里面轨道*/ border-left: 1px solid #595959; } 回答关注问题邀请...
2.小页面 小页面利用引用了一个全局样式,大部分页面都是不要滚动条的,少数有问卷填充的需要滚动条, <!-- 全局样式 --><linkrel="stylesheet"href="<%=request.getContextPath()%>/css/main.css">里面有一个属性: ::-webkit-scrollbar { width: 0 } 因此我的小页面无论如何设置都出不来滚动条,如果我...
::-webkit-scrollbar 仅仅在支持WebKit的浏览器 (例如, 谷歌Chrome, 苹果Safari)可以使用. ::-webkit-scrollbar — 整个滚动条. ::-webkit-scrollbar-button — 滚动条上的按钮 (上下箭头). ::-webkit-scrollbar-thumb — 滚动条上的滚动滑块.
::-webkit-scrollbar-button { background-color: slateblue; } 于是乎我们加上之前的代码再试试: 我们可以看出,两个箭头的按钮位置的背景颜色发生了变化。看来,滚动条的其他伪类属性需要配合第一步中的::-webkit-scrollbar才能生效。 3. 滚动条上的滚动滑块 ...
尤其是Less的语法,xdm常常误以为只要把 ::-webkit-scrollbar 放在 .myDiv 的花括号包裹中就可以生效,实际上不会有任何的效果。 一定要在 ::-webkit-scrollbar 的前面加上& 浏览器兼容性 由于是基于webkit内核提供的方法,所以部分其他内核的浏览器无法兼容,如果对兼容性需求较大,可以使用第三方组件库带有的滚动条...
::-webkit-scrollbar-button 滚动条两端的按钮。可以用display:none让其不显示,也可以添加背景图片,颜色改变显示效果。 ::-webkit-scrollbar-track 外层轨道。可以用display:none让其不显示,也可以添加背景图片,颜色改变显示效果。 ::-webkit-scrollbar-track-piece 内层轨道,滚动条中间部分(除去)。
//滚动条的宽度::-webkit-scrollbar { width: 10px; height: 10px; } //滚动条的滑块::-webkit-scrollbar-thumb { background-color: #a1a3a9; border-radius: 3px; } Ps1:滚动条样式存在兼容性问题,以上的样式是在 Webkit 浏览器 下可生效的! Ps2:宽高设置成一样,避免出现意想不到的样式BUG~,特别...