Объединение двух или более селекторов CSS с логическим условием - PullRequest
8 голосов
/ 27 января 2010

Есть ли способ объединить два или более селектора CSS с использованием логического условия - and, or, not?

Учтите это <div>:

<div class="message error">
    You have being logged out due too much activity.
</div>

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

Что-то вроде div.message && div.error?

Ответы [ 2 ]

13 голосов
/ 27 января 2010

Это должно работать:

&& = div.message.error {}
|| = div.message, div.error {}

Не думаю, что вы можете сделать "не"

Редактировать: только что сделал быстрый тест для подтверждения:

<html>
    <head>
        <style type="text/css">
            div.error.message {
                background-color: red;
            }
            div.message, div.error {
                border: 1px solid green;
            }
        </style>
    </head>
    <body>
        <div>None</div>
        <div class="error">Error</div>
        <div class="message">Message</div>
        <div class="error message">Error Message</div>
    </body>
</html>

Все div "message", "error" и "message error" имеют зеленую рамку, и только div "message error" имеет красный фон.

5 голосов
/ 27 января 2010

Попробуйте div.message.error.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...