CSS: no (: último hijo): después del selector
Tengo una lista de elementos, que tienen el estilo siguiente:
ul {
list-style-type: none;
text-align: center;
}
li {
display: inline;
}
li:not(:last-child):after {
content:' |';
}
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
</ul>
Expandir fragmento
Salidas One | Two | Three | Four | Five |
en lugar deOne | Two | Three | Four | Five
¿Alguien sabe cómo seleccionar con CSS todos los elementos excepto el último?
Puedes ver la definición del :not()
selector aquí.
Aceptado
Si se trata de un problema con el selector not, puede configurarlos todos y anular el último.
li:after
{
content: ' |';
}
li:last-child:after
{
content: '';
}
o si puedes usarlo antes, no es necesario el último hijo
li+li:before
{
content: '| ';
}
Todo parece correcto. Es posible que desee utilizar el siguiente selector CSS en lugar del que utilizó.
ul > li:not(:last-child)::after