Инструмент для разграничения двух элементов CSS

У меня есть два div, которые немного отличаются друг от друга, я просмотрел каждый из их свойств CSS, и они кажутся одинаковыми, однако мне интересно, не заметил ли я что-то.

Есть ли инструмент, который в основном будет отличать CSS от двух разных элементов?

Предпочтительно интегрирован в браузер.

ИЗМЕНИТЬ

Я использовал встроенные в инструменты разработчика Chrome и прошел через область вычисленных стилей и вручную сравнивал каждое свойство (IE div.A font-weight: normal; div.B font-weight: normal и т.д.)

Я ищу инструмент, который по существу говорит "Select Element A and B", и выдает список различий. Как сравнение с Winmerge или что-то в этом роде.

Ответы

Ответ 1

Аналогичный вопрос был задан здесь, и в результате я создал script, который сравнивает два элемента в Chrome (вы найдете его в связанном ответе), Кроме того, на основе указанного script, я создал удобное расширение Chrome DevTools "Diff" .

CSS Diff in action

Ответ 2

Я думаю, Firediff - это то, что вы хотите. В то время как он не сравнивает два элемента, но он изменяет logs DOM, поэтому вы можете сравнить эти журналы, чтобы узнать, что происходит.

Также вы можете перейти к вычисленному стилю в Firebug и скопировать/вставить вычисленный стиль каждого div в другой файл блокнота, а затем сравнить эти файлы с помощью инструмента сравнения файлов. BeyondCompare действительно круто.

Ответ 3

Теги

div иногда бывают разными с теми же свойствами. Причина в том, что ваш другой код может повлиять на него. В Firefox вы можете использовать firebug. важная вещь в моем opineon - вам нужно проверить код вокруг divs, который влияет на их поведение.

Ответ 4

Я использую расширение Code Cola для Google Chrome. Очень хороший и мощный инструмент. Рекомендовать всем.

Ответ 5

Помимо сравнения, это инструмент для сравнения css или любого типа файла

Ответ 6

Большинство основных браузеров поставляются со встроенными инструментами разработчика. Например, в chrome вы можете щелкнуть правой кнопкой мыши элемент и выбрать "проверить элемент", который приведет вас к панели. На этой панели справа вы можете увидеть стили css, применяемые к любому элементу. В Firefox есть надстройка, которую вы можете получить, называемый firebug, который делает то же самое. У Opera есть некоторые слабые интегрированные инструменты для разработчиков, которые дают вам красивые правители при подсветке элемента. IE... хорошо.... IE тоже их... просто не так хорошо.