曹耘豪的博客

SVG修改颜色的三种方式

  1. 直接设置fill和stroke
  2. 添加class
  3. 设置为currentcolor，使用当前字体颜色（推荐）

直接设置fill和stroke

1
<svg xmlns="http://www.w3.org/2000/svg" fill="red" stroke="red"></svg>

添加class

1
2
3
4
.my-color {
    fill: red;
    stroke: red;
}
1
<svg class="my-color" xmlns="http://www.w3.org/2000/svg"></svg>

设置为currentcolor，使用当前字体颜色（推荐）

1
<svg xmlns="http://www.w3.org/2000/svg" fill="currentcolor" stroke="currentcolor"></svg>
  技术 / 前端