Css 在角度10如何减少垫形场外观轮廓边框尺寸

在angular 10中，使用@angular/material，如何减少悬停状态下轮廓边框的

mat form字段

外观

我可以使用以下代码修改默认边框大小：

:host ::ng-deep .mat-form-field-appearance-outline .mat-form-field-outline {
  color: black;
}

悬停时，会显示一种黑色，如下图所示

我需要在悬停时像这样展示它

---

如果在浏览器中检查输入元素，您会注意到悬停状态会影响

.mat form field outline

中的3个内部元素。因此，要强制所有这些元素即使在悬停状态下也获得1px宽度的黑色边框，可以执行以下操作：

.mat表单字段：：ng deep.mat表单字段轮廓开始，
.mat表单字段：：ng deep.mat表单字段轮廓间隙，
.mat表单字段：：ng deep.mat表单字段轮廓结束{
颜色：黑色；
边框宽度：1px！重要；
}

⚡ 以下是一个工作示例：

---

检查CSS时会发生什么？你看到这个样式的选择器是什么了吗？我确实检查了css。我看到了css代码。但是在悬停外观上，粗边框线的大小无法在你编写的代码中减少，没有

：hover

，因此它确实不会影响悬停状态…谢谢。它正在工作。