”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 如何强制滚动条出现在移动浏览器上?

如何强制滚动条出现在移动浏览器上?

发布于2025-01-15
浏览:762

How Can I Force Scrollbars to Appear on Mobile Browsers?

在移动浏览器中显示滚动条

本题重点讨论移动浏览器中使用“overflow:auto”或“时隐藏滚动条的问题”可滚动内容上的“溢出:可见”。虽然滚动条在桌面浏览器上可见,但除非主动滚动,否则它会在移动设备上消失。

要解决此问题,您可以修改 CSS 以包含以下特定于 Webkit 浏览器引擎的代码:

::-webkit-scrollbar {
    -webkit-appearance: none;
}

::-webkit-scrollbar:vertical {
    width: 12px;
}

::-webkit-scrollbar:horizontal {
    height: 12px;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .5);
    border-radius: 10px;
    border: 2px solid #ffffff;
}

::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #ffffff;
}

此代码定义滚动条的外观,包括其宽度、高度、滑块颜色和轨道颜色。通过自定义这些属性,您可以使滚动条在移动设备上始终可见,甚至在滚动之前也是如此。

最新教程 更多>

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3