під час перегляду модифікованого css за допомогою інструментів розробника [закрито]

На інструменті розробника ви можете змінювати CSS на льоту і дисплей змінюється миттєво.

Але якщо натиснути джерело перегляду сторінки, ви отримаєте оригінал css документа

Це може бути чудово мати цей CSS командою або аддоном.

Як я можу переглянути модифікований CSS під час руху за допомогою інструментів розробника?

Firefox

Зміни, що вносяться до перегляду Правил, відображаються в Редакторі стилів і навпаки.

Джерело Інструменти для розробників Firefox Вивчайте та редагуйте CSS

Щоб відкрити редактор стилів, виберіть у меню "Веб-розробник" параметр "Редактор стилів" (це підменю в меню "Інструменти" на Mac). Панель інструментів з’явиться внизу вікна браузера, з активованим редактором стилів:

Джерело Firefox Інструменти для розробників Стиль редактор

Хром

Стійкі зміни

• При зовнішній зміні правила аркуша стилів відповідний текст ресурсу оновлюється на панелі «Ресурси», а історія редагувань зберігається для таких ресурсів аркуша стилів, поки вікно DevTools не закриється.

• Активуйте панель "Ресурси", знайдіть tutorial.css у дереві ресурсів. Зауважте, що вузол дерева розширюється. Клацніть стрілку поруч із заголовком вузла, і ви побачите всі внесені вище модифікації ресурсу.

• Виберіть будь-яку версію, щоб побачити її відмінності від оригінального ресурсу таблиці стилів, виділеного рядком.

  

• Ви можете перетягнути вузол редагування таблиці стилів у більшість текстових редакторів, щоб експортувати вміст версії.

Стилі редагування джерел