CSS - p :: first-letter：不起作用

Question

我必须增加不是P或class="ejemplo"的每个id="lectura"元素的第一个字母的大小。

这非常有效：

p::first-letter {
  font-size: 300%;
}

但是当我尝试匹配要求并且我这样做时，它不起作用：

p::first-letter:not([class="ejemplo"]):not([id="lectura"]) {
  font-size: 300%;
}

我是CSS的初学者，所以我做错了什么？

Answer 1

伪元素::first-letter必须在你的陈述中排在最后：

订单重要：

MDN's docs:

  

您只能在选择器中使用一个伪元素。 必须出现在语句中的简单选择器之后。

所以：

＆＃13;

＆＃13;

p:not([class="ejemplo"]):not([id="lectura"])::first-letter {
  font-size: 300%;
}

＆＃13;

<p>Loren Ipsum Dolor Sit Amet</p>
<p class="ejemplo">Loren Ipsum Dolor Sit Amet</p>
<p id="lectura">Loren Ipsum Dolor Sit Amet</p>

＆＃13;

＆＃13;

＆＃13;

同时...

请注意，对于ID选择，请使用#id代替[id='']，.class代替[class='']

p:not(.ejemplo):not(#lectura)::first-letter {

Answer 2

使用：

p:not([class="ejemplo"]):not([id="lectura"])::first-letter {

相反：

p::first-letter:not([class="ejemplo"]):not([id="lectura"]) {

Answer 3

您应该最后添加::first-letter

＆＃13;

＆＃13;

p:not(.ejemplo):not(#lectura)::first-letter{
  font-size: 300%;
}

＆＃13;

<p>test</p>
<p id="lectura">test</p>
<p class="ejemplo">test</p>

＆＃13;

＆＃13;

＆＃13;