Как проверить псевдо-классы CSS с помощью firebug?

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

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

Я видел:
Hover Inspection in 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?

Ответ 1

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

ИЗМЕНИТЬ

Здесь изображение: enter image description here

Ответ 2

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

Ответ 3

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