Как фильтровать и показывать только примененный CSS в Chrome Developer Tools (например, Firebug в Firefox)

Question

Как фильтровать и показывать только примененный CSS в Chrome Developer Tools (например, Firebug в Firefox)

Фоновая история: у меня есть страница с несколькими CSS, которые перекрывают друг друга. Существует так много перечеркнутых стилей CSS, поэтому я не хочу их видеть.

Я знаю, что Firebug в Firefox предоставляет эту функцию (только Показать примененный CSS), которая может показать, какой стиль CSS в каком файле CSS применяется (аккуратно!).

Как у нас есть эта функция в Chrome? Я попытался установить Firebug Lite для Chrome, но не повезло.

PS: в Chrome есть вкладка Computed Style, но она не показывает, какой стиль взят из какого CSS-файла.

19

css google-chrome firebug firebug-lite

Источник

user1061067 27 май '13 в 09:29

1 ответ

Решение

Другие вопросы по тегам css google-chrome firebug firebug-lite

user1031766 27 май '13 в 09:44 2013-05-27 09:44 · Accepted Answer · 2013-05-27 09:44

В инструментах разработчика Chrome в правом столбце (где CSS отображается на панели "Элементы") первый раздел называется "Computed Style". Если вы отмените выбор "показать наследуемое", вы получите аккуратный список стилей, которые действительно применяются к элементу. Это помогает?