为特定组件启用滚动

Question

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

style.scss

::-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;
    }
}