我需要将所有未使用 class="ejemplo"
或 id="lectura"
的 P
元素的首字母大小写增加。
以下代码可以完美实现:
p::first-letter {
font-size: 300%;
}
但是当我尝试满足要求并执行此操作时,它不起作用:
p::first-letter:not([class="ejemplo"]):not([id="lectura"]) {
font-size: 300%;
}
我是CSS的初学者,那么我做错了什么呢?
我需要将所有未使用 class="ejemplo"
或 id="lectura"
的 P
元素的首字母大小写增加。
以下代码可以完美实现:
p::first-letter {
font-size: 300%;
}
p::first-letter:not([class="ejemplo"]):not([id="lectura"]) {
font-size: 300%;
}
我是CSS的初学者,那么我做错了什么呢?
::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 {
使用:
p:not([class="ejemplo"]):not([id="lectura"])::first-letter {
相反:
p::first-letter:not([class="ejemplo"]):not([id="lectura"]) {
你应该在最后添加::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>
not(.ejemplo||.ejemplo2||.ejemplo3)
这样的内容?还是说我应该为每个类别重复使用:not
选择器? - Drumnbass:not
不能使用复杂的选择器,因此您很可能需要重复它。 - Harry