css选择器:第一段div中的第一个字母

Question

<div>
 <p>
  Once upon a time..
 </p>
 <p>
  A beautiful princess..
 </p>
</div>

我怎样才能选择(在我的css中)这个div中第一段的第一个字母？

谢谢

卢卡

Answer 1

div p:first-of-type:first-letter { font-weight: bold; }

Answer 2

在某些情况下,您可能会在" <p>示例" 之前使用标题或其他元素类型:

<div>    
<h1>My Great Title</h1>
<p>
In my younger years I was a great man, but all that changed when I saw...
</p>
<p>
I struck him for shaming my name, my family, my life. It was a shameful...
</p>
</div>

所以在这种情况下,p:first-child由于某种原因不会起作用,至少在Chrome或Safari中是这样.

所以相反你会想要使用它:

div p:first-of-type:first-letter{
/* add your awesome code here */
}

感谢您的时间.

第一的型