带有3个css“省略号”的Angular 7 mat-select问题答案

【问题标题】：Angular 7 mat-select problem with 3 dots of css "ellipsis"带有3个css“省略号”的Angular 7 mat-select问题
【发布时间】：2020-07-06 16:04:36
【问题描述】：

我对 mat-select 属性“ellipsis”有疑问。这 3 个点的颜色与文本颜色不同。我试图这样做，但它们仍然是 3 个黑点而不是白色

   ::ngdeep .example{
        color: white
    }

【问题讨论】：

class 是一个关键字，尝试使用与selector 不同的名称，并且颜色color:white; 在这种情况下应该可以工作，这意味着无论您使用的是ellipsis 代码，您只需要使用color。
"class" 就是一个例子。现在我在“示例”中对其进行了编辑，现在可能更清楚了
@Manjuboyz 我知道我使用颜色：白色；但它不仅在“mat-Select”中有效，
@RiccardoF。你能用你的设置和问题创建一个 StackBlitz 吗？谢谢。

【解决方案1】：

好像各种css的值好像有重叠，可以加上"::ng-deep"和"!important”，它对我有用。尝试在你的 CSS 中使用这样的 sn-p：

 ::ng-deep .mat-select .mat-select-value-text {
     color: white !important;
  }

【讨论】：

【解决方案2】：

Elipssis 可以隐藏宽度和溢出，这里有一个代码你可以试试

.example{
  white-space: nowrap; 
  width: 50px; 
  overflow: hidden;
  text-overflow: ellipsis; }

谢谢

【讨论】：