带有滚动的表格的css选择器

【问题标题】：css selector for table with scroll带有滚动的表格的css选择器
【发布时间】：2022-01-08 20:08:24
【问题描述】：

我在 html 页面中有一个表格，它可以包含一些或许多记录，我想将特定的css应用于表格，只有当表格上有滚动时，当有一些记录并且没有滚动时我不希望这个css定义影响表格. 我该怎么做？

table **here I need the selector** thead {
     width: calc( 100% - .5em )/* scrollbar is average 1em/16px width, 
      remove it from thead width */
}

【问题讨论】：

请分享您的代码以及到目前为止您尝试过的内容

标签： css angular sass scroll

【解决方案1】：

使用ViewChild 引用表格并检查滚动是否在ngClass 中可见，如果存在滚动，则该类将添加到表格中：

<table #table [ngClass]="{'visibleScroll': table.scrollHeight > table.clientHeight }"></table>

然后在css样式表中添加你的类：

.visibleScroll{
//your style css
}

【讨论】：