Как я могу проверить псевдо-классы CSS с помощью firebug? - PullRequest
26 голосов
/ 22 марта 2011

Я борюсь с неохотным a:hover стилем CSS, который я не могу переопределить.

Я пытался проверить элемент в Firebug, но не могу понять, почему он не будет работать. Я даже не вижу, как правильно проверить событие a:hover css в Firebug.

Я видел:
Инспекция зависания в Firebug http://blog.borngeek.com/2010/04/16/hover-inspection-in-firebug/
но я не понял, как воспроизвести шаги, упомянутые там.

Также: Псевдо-фантомы http://meyerweb.com/eric/thoughts/2009/11/03/pseudo-phantoms/

Как проверить / отладить псевдоклассы CSS, такие как :hover, с помощью Firebug?

Ответы [ 3 ]

43 голосов
/ 22 марта 2011

Это довольно легко. Просто выберите элемент, который вы хотите проверить. Затем на панели справа щелкните элемент меню Style. Там вы можете выбрать псевдокласс :hover

EDIT

Вот изображение: enter image description here

0 голосов
/ 18 сентября 2013

При решении подобных проблем полезным может быть сравнение состояния при наведении и состояния при не наведении.Откройте два экземпляра браузера (полезно использовать двойной или тройной экран), загрузите страницу, над которой вы работаете, в каждом окне, а затем сделайте то, что сказал ДжонП в своем ответе, чтобы просмотреть стили для состояния наведения в одном окне,не парить в другом, и и взять анализ оттуда.В Firebug неудобно сравнивать стили, когда раскрывающийся список стилей покрывает фактическую панель подробностей css, и в то время как вы можете просматривать CSS состояния наведения и отсутствия наведения в Firefug, перемещая мышь над элементом, над которым вы работаете, и выполняясравнение таким способом более сложно.

0 голосов
/ 07 апреля 2011

Theres также опция INSPECT ELEMENT, просто щелкните правой кнопкой мыши на элементе наведения в Firefox + Firebug, и вот оно.Меню стилей тоже удобно.

...