4
Я хочу сделать селектор CSS для класса, который начинается с пробела, но я не знаю, как это сделать. Например: <table class=" example">…</table>.Ориентация на значение класса, которое начинается с пробела
A
ответ
3
Любые ведущие или конечные пробелы в значении атрибута класса не имеют смысла для целей таргетинга. Это: class=" example" эквивалентно этому: class="example".
Нет необходимости в специальном селекторе, который влияет на пространство.
Из HTML 5 спецификации:
строка, содержащая набор разделенных пробелами лексем может иметь ведущие или хвостовые символы пробела.
Косвенные символы необходимы, однако, для разделения нескольких значений в атрибуте класса.
Атрибут, если указано, должен иметь значение, которое представляет собой набор разделенных пробелами лексем, представляющих различные классы, что элемент принадлежит.
+1
Когда вы видите такие вещи, часто HTML (включая атрибут класса) подобен этому, потому что он генерируется серверным скриптом, который предназначен для обработки и «склеивания» вместе нескольких классов, а кодер не беспокоился очистка ведущих/конечных пробелов. –
3
CSS-классы - это одиночные слова; пробелы просто разделяют разные имена классов.
Вы хотите .example.
+0
Итак, пробелы в исходном HTML-классе не имеют значения, @SLaks? –
+1
Хотя я понимаю, что вы имеете в виду, термин «одиночные слова» не совсем ясен. Может быть полезно немного расширить (дефисы, подчеркивания и т. Д.) –
+0
@Dumb Noob: Пробелы в начале и в конце атрибута нет. – BoltClock
3
Пробелы в начале и в конце значения для атрибута класса являются незначительными для целей селекторов классов. class=" example" действителен HTML и эквивалент class="example", class="example " и даже class=" example " для целей селектора классов .example.
Поэтому селектор, который вы ищете, просто .example.
Единственная ситуация, при которой она имеет значение в селекторах, имеет селектор атрибутов: [class~="example"] будет соответствовать всем приведенным примерам, но [class="example"] будет соответствовать только class="example". (Следовательно, это означает, что если у вас есть какая-то эзотерическая причина, чтобы захотеть сопоставить элемент только тогда, когда его атрибут класса имеет ведущее пространство, вы можете использовать либо [class^=" example"], либо [class=" example"], но скорее всего вам просто нужен обычный селектор классов.)
Почему вы хотите сделать это (чего не можете)? –
@torazaburo: Наверное, не имеет большого выбора. См. Комментарий cale_b на ответ Michael_B по какой-либо возможной причине. – BoltClock