css改变图标 |tcsstr使用方法

select css换行，css真假鉴定方法，网页css浮动怎么写，取消css按钮点击效果，前端css居中是哪个代码，css3图片hover效果，tcsstr使用方法 css改变图标 |tcsstr使用方法

.icon {
display: inline-block;
width: 20px;
height: 20px;
margin-right: 5px;
}
.icon:before {
content: "\f0c9";
font-family: "FontAwesome";
font-size: 14px;
color: #333;
}
.icon.success:before {
content: "\f058";
color: green;
}

上述代码中，.icon类被添加到需要改变图标的元素上，使用伪元素:before来添加图标。使用content属性来设置图标的 Unicode 码，可通过在线字体库获取对应的 Unicode 码。同时，还需要指定字体家族font-family来将所需要的字体导入到页面中。

你还可以为不同类型的图标添加不同的样式：

<div class="icon success"></div>

如上所示，在需要改变图标的标签上添加额外的类success，在 CSS 代码中使用新的伪元素样式。这时候其实就利用了.icon.success:before来选择实现不同的效果了。