css - CSS 文本样式

Question

有没有办法让标签中的第一个词与该标签中的其他词不同？例如，假设我有这段代码：

<h4>Worpress Quick Tip Of The Week</h4>

有没有办法让“Wordpress”这个词的样式与使用 css 的其他词不同？我知道我可以在 Wordpress 这个词周围放置一个独特的类，但是不这样做有可能吗？

Answer 1

不，你不能。

您将需要使用另一个标签。

CSS 使用以标签为目标的选择器。但是，您会注意到，标签内的文本不是任何选择器都可以定位的内容。您定位包含文本的标签。

如果你可以在它周围包裹任何东西，那么你可以。例如，只需添加一个跨度，然后您可以：

p:first-child {font-size:2em}

因为 p 的第一个孩子将是跨度。

Answer 2

如果您想设置第一个字母的样式，则可以使用 :first-letter 伪标签，但我不知道第一个单词标签。

h4:first-letter {
  font-size: larger;
}

Answer 3

请看看这个。

有但没有first-letter，但是您可以在 javascript 的帮助下实现这一点。first-linefirst-word

示范。

Answer 4

:first-word不幸的是没有选择器。您可以看一下这个脚本，尽管它通过将firstWord类添加到第一个单词来实现它。

span.firstWord {
  font-weight:bold;
  text-decoration: underline;
}