Appearance
SVG使用currentColor变更颜色的实现
我们可以使用currentColor
属性来动态变更SVG的颜色。具体实现如下:
- 将
<path>
标签中的fill="#f2b044"
改为fill="currentColor"
。
html
<svg>
<path fill="currentColor" d="..."/>
</svg>
currentColor
会取当前标签或上级标签的字体颜色值。因此,我们可以在SVG标签或上级标签设定color
属性。例如:
html
<div style="color: #df2222;">
<svg>
<path fill="currentColor" d="..."/>
</svg>
</div>
这样就能实现SVG颜色的变化,非常方便。
替换el-dialog关闭小图标
我们可以通过修改icon
的content
来替换el-dialog
的关闭小图标。以下是具体步骤:
默认样式:
css
.el-icon-close:before {
content: "\e6db";
}
修改后的样式:
css
.el-dialog__close.el-icon-close {
&::before {
content: "\e78d";
}
}
通过以上修改,就可以成功替换el-dialog
的关闭小图标。