Использовать CSS для нацеливания на любой элемент, в котором есть ЛЮБЫЕ два класса? - PullRequest
6 голосов
/ 27 июля 2011

Наша производственная среда использует технологию адаптации, которая несовместима с несколькими классами CSS. Это означает, что при стилизации HTML легко забыть и использовать два класса, и он перестает работать, как только он начинает работать.

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

Что-то вроде этого - мое намерение, хотя, конечно, это неверно. Следует выделить любой элемент, к которому применены два класса:

.*.* { /* not valid (I wish) */
  outline:2px dotted red;
  }

Я понимаю, что это сработало бы, если бы я знал классы, проблема в том, что я хочу пометить ЛЮБЫЕ два класса:

.classA.classB { /* not good enough */
  outline:2px dotted red;
  }

Я понимаю, что мог бы сделать это с JS и букмарклетом, и, возможно, это единственное решение. Если это возможно только с помощью CSS, это будет лучше, так как это автоматически помечает вещи для всех разработчиков и QA.

Ответы [ 3 ]

6 голосов
/ 27 июля 2011

Я только что нашел приемлемый ответ:

[class*=" "] {
  outline:2px dotted red;
  }

Это выделяет что-либо с пробелом в атрибуте класса.Он получает некоторые ложные срабатывания, потому что иногда пробелы в атрибуте класса происходят на законных основаниях в результате разборчивого кода на стороне сервера, но я предпочитаю ложные срабатывания ложным отрицаниям.

Есть лучшие идеи?

4 голосов
/ 21 августа 2011

Чтобы удалить большинство ложных срабатываний (например, значения атрибутов с пробелами), вы можете использовать этот селектор:

[class*=" "]:not([class^=" "]):not([class$=" "]) {
    outline: 2px dotted red;
}

Это все равно не отфильтровывает повторяющиеся классы в значениях, таких как class="foo foo", как указал Phrogz в вашем собственном ответе, но это лучше, чем ничего, и я думаю, что это происходит гораздо реже, чем атрибуты классов с пробелами.

1 голос
/ 27 июля 2011

Это невозможно только при использовании CSS.

И, если можно так выразиться, ваша производственная среда глупа. CSS без нескольких классов подобен облаку тегов, для которого разрешен только один тег. Это побеждает некоторые цели. Исправьте вашу производственную среду так, чтобы не злоупотреблять CSS таким образом, вместо того, чтобы ограничивать ваших авторов от правильного семантического описания контента.

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