Выделение курсивом с использованием псевдоэлементов css не работает, если css записан в одну строку [duplicate]

Question

Выделение курсивом с использованием псевдоэлементов css не работает, если css записан в одну строку [duplicate]

0

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

Я создал скрипку (http://jsfiddle.net/aniruddha/VZ43T/3), чтобы продемонстрировать эту проблему. Версия 2 той же скрипки демонстрирует рабочий код

Не работает:

.filterBox::-webkit-input-placeholder, .filterBox::-moz-placeholder, .filterBox::-ms-input-placeholder {
    font-style: italic;
}

За работой:

.filterBox::-webkit-input-placeholder {
    font-style: italic;
}
.filterBox::-moz-placeholder {
    font-style: italic;
}
.filterBox::-ms-input-placeholder {
    font-style: italic;
}

Почему это не работает, когда псевдоэлементы находятся в одной строке? CSS Validator (http://jigsaw.w3.org/css-validator/validator) говорит, что оба CSS действительны для CSS уровня 3.

Спасибо, Анируддха

user194341 13 дек. 2013, в 08:22

Источник

0

Если вы прокрутите страницу результатов проверки, вы увидите, что она жалуется на расширенные псевдоэлементы, которыми все они являются.
BoltClock♦ 13 дек. 2013, в 07:07

Теги:

html

css

css3

css-selectors

pseudo-element

2 ответа

Ещё вопросы

Если вы прокрутите страницу результатов проверки, вы увидите, что она жалуется на расширенные псевдоэлементы, которыми все они являются.

Ming · Answer 1 · 2013-12-13T05-17-00.000Z

Поскольку они являются псевдо-элементами, зависящими от поставщика, они не входят в спецификации CSS. Один из браузеров будет принимать только один из них и не будет работать на других, а затем не будет выполнять все правило. Разделение их - единственный способ остановить это.

Это похоже на наличие недопустимого синтаксиса CSS в вашем правиле - все правило выходит из строя.

Amarnath Balasubramanian · Answer 2 · 2013-12-13T04-59-00.000Z

Селектор (см. Модуль Selectors [SELECT]) состоит из всего до (но не включая) первой левой фигурной скобки ({). Селектор всегда сочетается с {} -block. Когда пользовательский агент не может разобрать селектор (т.е. Он недействителен CSS3), он также должен игнорировать {} -block.

Ссылка на эту ссылку: Почему невозможно объединить псевдоэлементы qaru.site/questions/106541/...

Для получения дополнительной информации см. Наборы правил CSS3

Почему группировка псевдоэлементов