淘先锋技术网

首页 1 2 3 4 5 6 7

当我们用CSS设计一个网页时,有时我们会想要去掉滚动条,以便更好地显示我们的页面。下面是一些CSS代码,可以帮助你去除滚动条。

/*隐藏滚动条*/
body::-webkit-scrollbar {
width: 0;
}
/*隐藏滚动条*/
body::-webkit-scrollbar {
display: none;
}

以上两个代码块都可以去除滚动条,只是不同的浏览器兼容性不同。第一个代码块是针对webkit内核的浏览器(如Chrome、Safari);第二个代码块是针对所有浏览器的,但是 Edge 浏览器不支持 display:none,需使用 width: 0; 进行兼容。

如果只想去除纵向滚动条,可以使用以下代码:

/* 隐藏纵向滚动条 */
body::-webkit-scrollbar-thumb:vertical {
display:none;
}

如果你只想去掉横向滚动条,可以使用以下代码:

/* 隐藏横向滚动条 */
body::-webkit-scrollbar-thumb:horizontal {
display:none;
}

需要注意的是,这些代码不会影响用户拖动页面和使用分页器等功能。