У меня есть CSS код, как это:Как отлаживать псевдозаполнитель заполнителя в firefox?
:-moz-placeholder,::-moz-placeholder {
color: #999;
/*some additional font styling*/
}
я могу нажать «Осмотреть элемент» и увидеть всю информацию о стиле элемента. Но где я могу увидеть все правила CSS, которые применяются к заполнителю элемента?
Заполнителя является псевдо-элемент, как :: до и после :: (https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements) иногда refered в качестве псевдо-класса (https://developer.mozilla.org/en-US/docs/Web/CSS/pseudo-classes)
Этих типов элементов не может рассматриваться в Firefox Inspector, вам необходимо по крайней мере Firebug или Chrome Dev Tools, но в последнее время он доступен и в Firefox Inspector. Они являются частью «теневого дома» (чрезвычайно простое описание: элементы, созданные браузером внутри других элементов).
Вы должны уметь находить местозаполнитель в инспекторах дома внутри ваших входных или текстовых элементов, например. выберите входной элемент, а затем выберите "проверить элемент" из меню правой кнопки мыши, то вы должны увидеть что-то вроде этого:
Firefox инспектор
Chrome Dev Tools
Для Chrome вам может потребоваться включить «Показать пользовательский агент shad ow DOM "в настройках Dev Tools.
Этот ответ будет еще лучше, если вы объясните, где в Firbug и/или Chrome Tools найдите местозаполнитель. – Jeff
В Chrome вы можете переключить shado dom через колесо с шестернями на картинке выше (или близко к ней). Это открывает настройки, и есть опция «Показывать теневой дом», проверьте это и обновите страницу, чтобы увидеть теневую DOM. –
Псевдоэлемент отличается от псевдокласса. Согласно спецификации: «'::' запускает псевдоэлемент, ':' псевдо-класс '(по адресу http://dev.w3.org/csswg/selectors-4) –
После этого вы сможете нажать на псевдо элементы: перед &: после и посмотреть их стиль. Не знаете, почему это отключено, в Chrome работает по умолчанию.
Из этого link
Вы хотите смотреть вдоль линий ** Показать Агент пользователя CSS ** (для поджигатель), хотя он отличается для каждого браузера/инструмент проверки DOM. Я напишу полный ответ, если у меня будет время. – Xareyo
Похоже, что вы используете встроенный инструмент проверки Firefox. Итак, вы хотите пойти _Inspect Element (Q)> Computed> Отметьте поле «Стили браузера» внизу: – Xareyo