为特定组件启用滚动

Question

我已经通过在style.scss中指定代码禁用了滚动项目。现在，我需要为特定组件的模板启用滚动。但我做不到。

样式.scs

::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}
::-webkit-scrollbar {
display: none;
}

以上是为了禁用滚动项目。

abc.html

<div class="col-sm-4 scroll">
<div class="card">
</div>

abc.scss

.scroll {
max-height: 100px!important;
overflow-y: auto!important;
}

我没有看到上面(abc.html & abc.scss(代码的任何滚动。请帮我解决

Answer 1

您已经将::-webkit-scrollbar元素设置为display: none。您需要再次显示：

.scroll {
max-height: 100px!important;
overflow-y: auto!important;
&::-webkit-scrollbar {
display: initial;
}
}