针对CSS中每个单词的首字母 [英] target first letter of each word in css
问题描述
我需要更改每个单词的每个第一个字母的大小,颜色和重量.我不是在说首字母大写.我的意思是针对第一个字母并根据我的选择应用样式. :单击此处查看有关我在说什么的示例.
I need to change size, color, and weight of every first letter of each word. I am not talking about Capitalize each first letter. I mean that target first letter and apply style according to my choice. : Click Here to see example about which i am talking.
推荐答案
您应该使用标签将每个单词包装起来,并使用::first-letter
CSS选择器.
You should wrap every single word with a tag and use ::first-letter
CSS selector .
此外,请注意,此选择器不适用于嵌入式元素.如果要与内联元素(例如<span>
)一起使用,请确保设置display:inline-block
(有关更多详细信息,请参见此处: https://stackoverflow.com/a/7631782/11298742 )
Also, note that this selector does not work on inline elements. If you want to use it with an inline element, such a <span>
, make sure you set display:inline-block
(see here for more details: 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;
}
<p><span>Lorem</span> <span>ipsum</span> <span>dolor</span> <span>sit</span> <span>amet</span></p>
这篇关于针对CSS中每个单词的首字母的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!