css滚动条一直显示不出来,CSS-溢出：滚动；-总是显示垂直滚动条？

小编典典

我自己就遇到了这个问题。OSx Lion在不使用时会隐藏滚动条，使它看起来更“光滑”，但是同时出现了您解决的问题：人们有时看不到div是否具有滚动功能。

解决方法：在您的CSS中包括-

::-webkit-scrollbar {

-webkit-appearance: none;

width: 7px;

}

::-webkit-scrollbar-thumb {

border-radius: 4px;

background-color: rgba(0, 0, 0, .5);

box-shadow: 0 0 1px rgba(255, 255, 255, .5);

}

/* always show scrollbars */

::-webkit-scrollbar {

-webkit-appearance: none;

width: 7px;

}

::-webkit-scrollbar-thumb {

border-radius: 4px;

background-color: rgba(0, 0, 0, .5);

box-shadow: 0 0 1px rgba(255, 255, 255, .5);

}

/* css for demo */

#container {

height: 4em;

/* shorter than the child */

overflow-y: scroll;

/* clip height to 4em and scroll to show the rest */

}

#child {

height: 12em;

/* taller than the parent to force scrolling */

}

/* === ignore stuff below, it's just to help with the visual. === */

#container {

background-color: #ffc;

}

#child {

margin: 30px;

background-color: #eee;

text-align: center;

}

Example

2020-05-16