html - 隐藏div上具有位置的滚动条:固定属性

This question already has answers here:

Hide scroll bar, but while still being able to scroll

                                    （31个答案）


                                2年前关闭。


我似乎无法弄清楚如何隐藏具有position：fixed属性设置的元素上的滚动条。我的应用程序需要一个固定高度的侧面菜单，其余内容应可滚动。我已经尝试将其包装在另一个div中，并将父对象的溢出属性设置为隐藏，但是它似乎不适用于固定元素。任何建议将不胜感激。
这是片段：

<!DOCTYPE html>
<html>
<head>
<title>Blabla</title>
</head>
<body>
<style>
.blabla {
position: fixed;
    height: 150px;
    width: 200px;
    background: red;
    /*overflow-y: hidden;*/
}
.blabla2 {

font-size: 20px;
    text-align: center;
    height: 149px;
    overflow-y: scroll;
}
</style>
<div class="blabla">
  <div class="blabla2">
  	blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>
  	blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>
    blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>
    blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>
    blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>blabla<br>
  </div>
</div>
</body>
</html>

最佳答案

.blabla2::-webkit-scrollbar {
width: 0px;
background: transparent;
}

资源：
Hide scroll bar, but while still being able to scroll

关于html - 隐藏div上具有位置的滚动条:固定属性，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49515127/