更改角度材质设计中以 md 为中心的复选框的颜色

Question

我正在使用角度材质，并且我一直使用md复选框，但是当我选中复选框并聚焦时，它会在复选框周围给我一个奇怪的粉红色圆形阴影（我只是想能够更改颜色）

<md-checkbox class="gray md-default-theme md-checked" checked="checked">

当选中并聚焦时，它会添加类"md-focused"，并在复选框周围给出一个淡淡的粉红色圆圈

<md-checkbox class="gray md-default-theme md-checked md-focused" checked="checked">

谁能解释一下我如何通过 css 更改它以更改颜色？

Answer 1

您必须覆盖.md-focused .md-container:before，因为样式已添加到伪元素中...（普兰克演示）

• 要覆盖所有复选框焦点：

  md-checkbox.md-focused .md-container:before {
      background-color: transparent !important;
  }
  

• 要仅覆盖某些复选框：

  .HTML

  <md-checkbox class="md-checkbox-no-focused">
      Checkbox without focus
  </md-checkbox>
  

  .CSS

  .md-checkbox-no-focused .md-container:before {
      background-color: transparent !important;
  }