在css中定位每个单词的首字母

【问题标题】：target first letter of each word in css在css中定位每个单词的首字母
【发布时间】：2018-04-01 21:24:45
【问题描述】：

我需要更改每个单词的每个首字母的大小、颜色和重量。我不是在谈论将每个首字母大写。我的意思是目标第一个字母并根据我的选择应用样式。：Click Here to see example about which i am talking.

【问题讨论】：

这是重复的：stackoverflow.com/questions/7440572/css-bold-first-word
不在 CSS 中。然而，在 JS 中可能。同意重复
@DerekBrown 先看看我的问题和例子。我不需要定位段落的第一个字母。我需要一个句子中每个单词的目标首字母。您提供的链接不是我的解决方案，我之前已经检查过

【解决方案1】：

你应该用标签包裹每个单词并使用::first-letter CSS选择器。

另外，请注意，此选择器不适用于内联元素。如果您想将它与内联元素一起使用，例如<span>，请确保设置display:inline-block（更多详细信息请参见此处：https://stackoverflow.com/a/7631782/11298742）

示例：

p span { display: inline-block; font-family: 'Roboto', sans-serif }
p span::first-letter {
    color: red;
    font-weight: bold;
}

&lt;p&gt;&lt;span&gt;Lorem&lt;/span&gt; &lt;span&gt;ipsum&lt;/span&gt; &lt;span&gt;dolor&lt;/span&gt; &lt;span&gt;sit&lt;/span&gt; &lt;span&gt;amet&lt;/span&gt;&lt;/p&gt;

【讨论】：