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

Question

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

這非常有效：

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

但是當我嘗試匹配要求並且我這樣做時，它不起作用：

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

我是CSS的初學者，所以我做錯了什么？

Answer 1

偽元素::first-letter必須在你的語句中排在最后：

訂單重要：

MDN的文檔：

您只能在選擇器中使用一個偽元素。 它必須出現在語句中的簡單選擇器之后 。

所以：

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

 <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> 

也...

請記住，對於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

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

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