CSS-界面转动时不显示转动条

设置转动条的样式：

div::-webkit-scrollbar {
  width: 0;
}

关于::-webkit-scrollbar

::-webkit-scrollbar CSS伪类选择器影响了一个米素的转动条的样式

::-webkit-scrollbar 仅仅在支持WebKit的浏览器 (例如, 谷歌Chrome, 苹果Safari)可以使用.

CSS转动条选择器

你可以使用以下伪米素选择器去修改各式webkit浏览器的转动条样式:

::-webkit-scrollbar — 整个转动条.
::-webkit-scrollbar-button — 转动条上的按钮 (上下箭头).
::-webkit-scrollbar-thumb — 转动条上的转动滑块.
::-webkit-scrollbar-track — 转动条轨道.
::-webkit-scrollbar-track-piece — 转动条没有滑块的轨道部门.
::-webkit-scrollbar-corner — 当同时有垂直转动条和水平转动条时交汇的部门.
::-webkit-resizer — 某些米素的corner部门的部门样式(例:textarea的可拖动按钮).

语法

::-webkit-scrollbar { styles here }

例子

.invisible-scrollbar::-webkit-scrollbar {
  display: none;
}

.mostly-customized-scrollbar::-webkit-scrollbar {
  width: 5px;
  height: 8px;
  background-color: #aaa; /* or add it to the track */
}

.mostly-customized-scrollbar::-webkit-scrollbar-thumb {
    background: #000; 
}

思源资源网：分类流动

1.阿里云: 本站现在使用的是阿里云主机，平安/可靠/稳固。点击领取2000米代金券、领会最新阿里云产物的种种优惠流动点击进入

2.腾讯云: 提供云服务器、云数据库、云存储、视频与CDN、域名等服务。腾讯云各种产物的最新流动，优惠券领取点击进入

3.广告同盟: 整理了现在主流的广告同盟平台，若是你有流量，可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/7801

发表于 2021-02-11 16:51
阅读 ( 206 )
分类：互联网

CSS-界面转动时不显示转动条

设置转动条的样式：

关于::-webkit-scrollbar

CSS转动条选择器

语法

例子

0 条评论

你可能感兴趣的文章

相关问题