Linux 拨号vps windows公众号手机端

滚动条如何设置

lewis 7年前 (2018-09-28) 阅读数 8 #程序编程

滚动条可以通过CSS进行设置。下面是一些常用的滚动条设置方法:

  1. 设置滚动条的宽度和颜色:
/* 水平滚动条 */
::-webkit-scrollbar {
width: 10px;
background-color: #f5f5f5;
}
/* 垂直滚动条 */
::-webkit-scrollbar {
height: 10px;
background-color: #f5f5f5;
}
  1. 设置滚动条的滑块颜色及样式:
/* 水平滑块 */
::-webkit-scrollbar-thumb {
background-color: #888;
}
/* 垂直滑块 */
::-webkit-scrollbar-thumb {
background-color: #888;
}
/* 悬停时的样式 */
::-webkit-scrollbar-thumb:hover {
background-color: #555;
}
/* 点击时的样式 */
::-webkit-scrollbar-thumb:active {
background-color: #333;
}
  1. 设置滚动条轨道的样式:
/* 水平轨道 */
::-webkit-scrollbar-track {
background-color: #f5f5f5;
}
/* 垂直轨道 */
::-webkit-scrollbar-track {
background-color: #f5f5f5;
}
  1. 隐藏滚动条:
/* 隐藏滚动条 */
::-webkit-scrollbar {
width: 0;
background-color: transparent;
}

这些样式只适用于WebKit内核的浏览器,如Chrome和Safari。其他浏览器可能有不同的样式设置方法。

版权声明

本文仅代表作者观点,不代表米安网络立场。

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

热门