可以为 Icon 字体分配不同的字体系列吗?
Assign different font family to an Icon fonts, possible?
大部分时间我使用 IcoMoon App 来获取一些图标或制作自己的图标来使用它们。我 运行 想在段落 <p>
标签旁边放置一个图标,通常 IcoMoon 生成图标并将它们与 class 名称相关联,伪 class :before
。我刚得到 class 并将其应用到我的段落中。
我发现一个问题,在应用图标字体之前,我已经为<p>
标签分配了一个font-family:my-font;
。当我应用图标时,与图标一起生成的 font-family:ico-moon;
被应用于标签,它毁了它。是否可以保留我的字体和 <p>
标签的图标?
p{
font-family:my-font;
}
.icon-moon-dummy:before{
font-family: 'icomoon' !important;
content:"\e900";
}
<p>this is normally displayed with "my-font" family </p>
<p class="icon-moon-dummy">
now "my-font" family is not applied instead "icon-moon" font is applied duesto the cascading and the "!important" statement.
is it possible now to have my font applied for the p tag and the icon-moon font applied only for the icon so that it works?
</p>
无法影响从 ::before
::after
(子元素)到父元素的字体,因此我认为一定有其他父元素覆盖了您的字体。
证明:
p {
font-family: "Comic Sans MS";
}
.test::before {
content: "foo ";
font-family: Arial;
}
<p class="test">
bar
</p>
大部分时间我使用 IcoMoon App 来获取一些图标或制作自己的图标来使用它们。我 运行 想在段落 <p>
标签旁边放置一个图标,通常 IcoMoon 生成图标并将它们与 class 名称相关联,伪 class :before
。我刚得到 class 并将其应用到我的段落中。
我发现一个问题,在应用图标字体之前,我已经为<p>
标签分配了一个font-family:my-font;
。当我应用图标时,与图标一起生成的 font-family:ico-moon;
被应用于标签,它毁了它。是否可以保留我的字体和 <p>
标签的图标?
p{
font-family:my-font;
}
.icon-moon-dummy:before{
font-family: 'icomoon' !important;
content:"\e900";
}
<p>this is normally displayed with "my-font" family </p>
<p class="icon-moon-dummy">
now "my-font" family is not applied instead "icon-moon" font is applied duesto the cascading and the "!important" statement.
is it possible now to have my font applied for the p tag and the icon-moon font applied only for the icon so that it works?
</p>
无法影响从 ::before
::after
(子元素)到父元素的字体,因此我认为一定有其他父元素覆盖了您的字体。
证明:
p {
font-family: "Comic Sans MS";
}
.test::before {
content: "foo ";
font-family: Arial;
}
<p class="test">
bar
</p>