css - cdk-virtual-scroll-viewport 在 firefox 版本 63.0 上隐藏滚动条

Question

我想隐藏 cdk-virtual-scroll 元素的滚动条，但找不到方法。这是我到目前为止所做的，但它不适用于 Firefox。在 Chrome 中工作正常。

这是我的CSS文件

cdk-virtual-scroll-viewport::-webkit-scrollbar {
    width: 0px;/* remove scrollbar space */
    background: transparent;/* optional: just make scrollbar invisible */
}

 cdk-virtual-scroll-viewport {
   -ms-overflow-style: none !important; // IE 10+
    scrollbar-width: none !important;
    overflow: -moz-scrollbars-none !important;
  }

这是我的html文件

<cdk-virtual-scroll-viewport role="list" [itemSize]="95"><div *cdkVirtualFor="let site of sites;let i=index;let last = last;trackBy: trackByIdx" tabindex="{{i}}+1">
    <li class="mdc-list-item site-list-item" (click)="routeToSite(site)">
          <span class="mdc-list-item__text">
            <span class="mdc-list-item__primary-text">{{site.name | truncate:60:true }}</span>
            <span class="mdc-list-item__secondary-text">{{site.groupName}} - {{site.siteType.name }}</span>
            <span class="mdc-list-item__secondary-text">{{site.numOfUsers}} Users, {{site.numOfJsas }}
              JSAs</span>
          </span>
           </li>
       </div>
    </cdk-virtual-scroll-viewport>

Answer 1

只要给

.class {
    scrollbar-width: none;
}