Как использовать псевдоклассы для выбора всех детей, кроме первого и последнего? - PullRequest
2 голосов
/ 30 января 2012

В CSS для примера, показанного ниже, как я могу сделать так, чтобы стили применялись ко всем абзацам, кроме первого и последнего абзаца?

<div class="entry">
    <p>...</p>
    <p>...</p>
    <p>...</p>
    <p>...</p>
    <p>...</p>
</div>

Я пробовал следующее, чтобы исключить первый абзац, но это не работает:

div.entry p:nth-child(n+1) {
    /* ... */
}

Я также пробовал nth-of-type() и not(), но не мог заставить их работать так, как я думал, что они будут.

Редактировать: Я решил обернуть все <p>, к которым я хочу применить стиль, в <div>. Я принял боздозский ответ, потому что он подошел ближе всего к решению исходной задачи (хотя и решил только половину).

Ответы [ 3 ]

10 голосов
/ 30 января 2012

Обновленный ответ:

Используйте :not(:first-child) и :not(:last-child)

div.entry p:not(:first-child):not(:last-child)

См. Обновленное JSFiddle .

2 голосов
/ 12 мая 2014

Я знаю, что опоздал на игру по этому поводу, но я подумал, что просто добавлю это для любых будущих зрителей.

div.entry p:not(:first-child):not(:last-child)

0 голосов
/ 14 апреля 2013

Я только что наткнулся на то, что может ответить на ваш вопрос:

Для представления всех h2 детей тела XHTML , за исключением первого и последнего ,можно использовать следующий селектор:

body > h2:nth-of-type(n+2):nth-last-of-type(n+2)

W3C - CSS3-селекторы

...