如何在不影响列表内容的字体大小的情况下将字体大小属性应用于ul标记

Question

我正在使用contentEditablediv来添加我的内容。 我使用 JavaScript（script#） 从我的 UI 设置字体大小、颜色、面部和项目符号。我使用 css 应用自己的项目符号样式。这是我的 css 之一

.marker-check-mark:before{
     content: "2718";
     margin: 0.5em;
     color : Black; 
}

这将打印一个"复选标记"作为"UL"类型。

现在我想将其字体大小定为 16。 但我不希望这影响此列表内容的字体大小。

有没有办法做到这一点。

一种解决方案是在每个 li 中添加带有 syle 属性的字体标签或 span 标签。但我想避免这个解决方案。

请给我一个更好的解决方案.....

Answer 1

如果我明白你在问什么，你想设置复选标记的大小吗？为什么不简单地设置之前选择器的字体大小？

.marker-check-mark:before  {
    content:"2718";
    margin: 0.5em;
    color : Black;
    font-size:16px;
}

小提琴

Answer 2

我认为你或多或少已经回答了你自己的问题！

这是你的答案：

.marker-check-mark:before{
    content: "2718";
    margin: 0.5em;
    color : Black;
    font-size: 16px
}

伪元素:before本质上充当 DOM 中的独立元素，这意味着您可以完全独立于元素本身设置它的样式。 因此，向.marker-check-mark:before添加font-size不会影响.marker-check-mark的字体大小。

请阅读此处以获取有关其工作原理的更多信息：http://coding.smashingmagazine.com/2011/07/13/learning-to-use-the-before-and-after-pseudo-elements-in-css/