Как я могу выбрать все дочерние элементы элемента, кроме последнего дочернего элемента?

Question

Как я могу выбрать все дочерние элементы элемента, кроме последнего дочернего элемента?

Как бы я выбрал все, кроме последнего ребенка, используя селекторы CSS3?

например, чтобы получить только последний ребенок будет div:nth-last-child(1).

674 6

css css3 css-selectors

6 ответов:

Comments

Ничего не найдено.

Nick Craver · Accepted Answer · 2017-01-11 23:43:53

можно использовать псевдокласс отрицания :not() на :last-child псевдо-класс. Будучи введены селекторы CSS уровня 3, он не работает в IE8 или ниже:
:not(:last-child) { /* styles */ }

Sebastien Horin · Accepted Answer · 2017-08-04 12:09:52

сделать это просто:

вы можете применить стиль ко всем div и повторно инициализировать последний с :в прошлом-ребенок:

например CSS:
.yourclass{
    border: 1px solid blue;
}
.yourclass:last-child{
    border: 0;
}
или SCSS:
.yourclass{
    border: 1px solid rgba(255, 255, 255, 1);
    &:last-child{
        border: 0;
    }
}
легко для того чтобы прочитать/запомнить

быстро, чтобы выполнить

совместимый браузер (IE9+ так как это все еще CSS3)

Robin B · Accepted Answer · 2017-01-11 23:48:01

решение Ника Крейвера работает, но вы также можете использовать это:
:nth-last-child(n+2) { /* Your code here */ }
Крис Койер из CSS трюков сделал хороший : nth tester для этого.

Nicholas Wilson · Accepted Answer · 2010-04-14 18:51:31

когда IE9 приходит, это будет проще. Однако большую часть времени вы можете переключить проблему на одно требование :первый ребенок и стиль противоположной стороны элемента (IE7+).

delphi · Accepted Answer · 2016-03-16 19:23:25

используя решение Ника крейвера с selectivizr позволяет кросс-браузерное решение (IE6+)

Avinash Malhotra · Accepted Answer · 2017-06-29 21:08:06

найти элементы из последнего, используйте
<style>
ul li:nth-last-of-type(3n){ color:#a94442}  /**/
</style>