1

Добрый день, интересует как задать стили всем элементам списка кроме первого, читал когда то про псевдо класс но забыл как называется.

3 ответа 3

4

Если вы не поддерживаете IE младше 9 версии, то вот решение:

li:not(:first-child) {
    color: red;
}

Можно также использовать first-child:

ul {
    background-color: #900;  /* будет применено к каждому ul */
}

ul:first-child {
    background-color: transparent; /* только для первого */
}

Для поддержки более старых браузеров можно воспользоваться следующей конструкцией - объявляется общий стиль, а на первом элементе указывается класс first-element:

ul {
    background-color: #900;
}

first-element { /* этот класс необходимо указать у первого элемента */
    background-color: transparent;
}
13
  • IE6, серьезно? в 2016 году? :-)
    – Grundy
    24 авг 2016 в 13:16
  • 2
    @Grundy мало ли, какие корпоративные приложения, автор же не озвучил требования. 6 конечно перебор, но 8 ещё встречается
    – FeroxTL
    24 авг 2016 в 13:18
  • 1
    предлагаю заменить на IE младше 9 версии или что-то подобное :-)
    – Grundy
    24 авг 2016 в 13:19
  • @Grundy поправил
    – FeroxTL
    24 авг 2016 в 13:19
  • @FeroxTL Все верно поддержка ie младше 9 версии не требуется, благодарю за оперативность. 24 авг 2016 в 13:24
2
:first-child
:first-of-type
:nth-of-type(1) 

:not(:first-child) {
  ...
}
3
  • в вопросе кроме первого - а эти как раз первому задают
    – Grundy
    24 авг 2016 в 13:13
  • для комплекта еще nth-child можно добавить
    – Grundy
    24 авг 2016 в 13:15
  • Поправила) А вообще можно задавать всем стили, но первому переопределить
    – SVE
    24 авг 2016 в 13:15
2

li { color: red; }
li:first-child { color: inherit; }

li:not(:first-child) { font-style: italic; }

li + li { text-decoration: underline; }
<ul>
  <li>All except first are red italic and underlined
  <li>All except first are red italic and underlined
  <li>All except first are red italic and underlined
  <li>All except first are red italic and underlined
  <li>All except first are red italic and underlined
  <li>All except first are red italic and underlined
  <li>All except first are red italic and underlined
</ul>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.