我有一个像下面这样的CSS类
.fa-unsorted:before, .fa-sort:before {
content: '\e9c2';
margin-top: -10px;
color: #999999;
font-family: 'icomoon';
}
显示如下
我想要的是也包括 \e9c1
但它应该显示在 \e9c2
下面。
对于上下文,我正在使用一个库,其中提到了用于显示排序图标的 css 类。它使用 fa-sort,在同一图标中同时具有向上和向下箭头。
但我使用的 icomoon 没有那种替代品。所以我需要用两个图标来显示排序。以下是我想要的
我尝试关注内容,但正如预期的那样,箭头彼此相邻显示。
content: '\e9c2\e9c1';
添加另一个类会很好,但我无法控制 JS 来添加新类。
最佳答案
不能向 :before 伪元素添加多个。
如果 :after 元素尚未被使用,我建议这样做:
.fa-unsorted:before, .fa-sort:before {
content: '\e9c2';
margin-top: -10px;
color: #999999;
font-family: 'icomoon';
}
.fa-unsorted:after, .fa-sort:after{
content: '\e9c1';
margin-top: -15px;
color: #999999;
font-family: 'icomoon';
right:0;
}
关于html - 是否可以在 css 内容中一个一个地使用两个图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45194971/