CSS псевдо-классы со статьей - PullRequest
Новая
       12

CSS псевдо-классы со статьей

2 голосов
/ 27 августа 2011

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

article:first {
    background: blue;
}

и 

article:first-child {
    background: blue;
}

Однако ни один из них, похоже, ничего не делает.

Моя HTML-разметка выглядит следующим образом (голова удаленаи содержимое перевело): 

...
<body>
    <div id="wrapper">
        <header>
            <hgroup>
                ...
            </hgroup>
        </header>
        <article>
            ...
        </article>
        <article>
            ...
        </article>
    </div>
</body>

Я также использую последнюю версию Chrome.

Ответы [ 2 ]

3 голосов
/ 27 августа 2011

То, что вы ищете, это #wrapper article:first-of-type, но, к сожалению, он пока не получил широкой поддержки.

Вы можете попробовать #wrapper header + article, для которого поддержка более распространена.

0 голосов
/ 27 августа 2011

Попробуйте изменить разметку: 

...
<body>
    <div id="wrapper">
        <header>
            <hgroup>
                ...
            </hgroup>
        </header>
        <section>
            <article>
                ...
            </article>
            <article>
                ...
            </article>
        </section>
    </div>
</body>

:first-child работает только с действительными первыми дочерними элементами (в вашем случае это было header).

...