Question

我有一个类，我应用于跨度格式有点不同，以显示某人必须采取的行动。

<p>Example of styling a <span style="background-color:#ccc; color:#066; font-weight:900; padding:0 8px;">Button</span> press.</p>

此示例显示内联样式，但最终将在类中。我想知道的是，可以在文本周围添加尖括号作为样式的一部分吗？我知道<q>可以实现这一目标，但我希望这可以成为样式信息的一部分。无论如何这都是可能的。

非常感谢您提前提供任何帮助。

Answer 1

是的，你可以使用伪元素在你的样式中包含括号，但是＆lt; = IE7不支持（上次我检查时市场份额约为4.5％）。此方法使用伪元素:before和:after分别在元素之前和之后生成基于CSS的内容（同时仍保留在.button内。）

enter image description here

.button:before {
    content:"<";
}

.button:after {
    content:">";
}

Answer 2

您可以使用伪:before和:after以及content轻松完成此操作。

span:before {
    content: "«";
}
span:after {
    content: "»";
}

我还认为这更适合作为kbd元素。