Как мне отредактировать CSS в Chrome, как в Firebug для Firefox? - PullRequest
18 голосов
/ 24 сентября 2010

Я редактировал CSS с помощью Firebug в Firefox, но недавно заметил, что Chrome рендерит мои страницы гораздо быстрее (с помощью прокрутки, интерактивных элементов и т. Д.) И хотел переключиться на него.

Я обнаружил, что Chrome показывает вычисленный CSS и какие атрибуты переопределяются в стеке, и я могу изменять их по одному, но в Firebug мне понравилось то, что я мог просто редактировать всю таблицу стилей в текстовом редакторе в реальном времени. , Это та же самая функция где-то на панели разработчика Chrome, или есть расширение Chrome, которое позволяет мне изменять таблицы стилей таким образом?

Ответы [ 10 ]

10 голосов
/ 19 декабря 2011

В текущих версиях Chrome (у меня работает 16) вам не нужны внешние надстройки. Щелкните правой кнопкой мыши в любом месте вашей страницы, выберите проверить элемент , затем в открывшемся окне нажмите вкладку Ресурсы , затем на левой панели выберите таблицу стилей, которую вы хотите редактировать. Чтобы начать редактирование, вам нужно сначала дважды щелкнуть текст CSS.

9 голосов
/ 24 сентября 2010

Попробуйте StyleBot . Также можно сохранить отредактированный CSS.

2 голосов
/ 13 декабря 2011

Я использую live.js! Когда вы редактируете свой CSS-файл, он показывает вам результаты в реальном времени в вашем браузере без обновления. http://livejs.com/

Я потратил бесчисленные часы, тестируя почти каждое расширение Chome, которое смог найти (включая stylebot), чтобы имитировать живое редактирование CSS Firebug в Firefox. Ни один на сегодняшний день не имеет такой же рабочий процесс. Live.js самый близкий.

2 голосов
/ 24 сентября 2010

Вы можете редактировать любое свойство или создать новое свойство, дважды щелкнув по записи или пустому месту на панели стилей панели «Элементы». На данный момент нет способа отредактировать весь CSS-файл так же, как текст.

1 голос
/ 13 ноября 2010

https://chrome.google.com/extensions/detail/bfbameneiokkgbdmiekhjnmfkcnldhhm

Панель инструментов веб-разработчика для Chrome> CSS> Редактировать CSS

1 голос
/ 24 сентября 2010

Пробовали ли вы использовать инструмент CSS-> Edit CSS для расширения панели инструментов веб-разработчика?

0 голосов
/ 04 марта 2014

Я написал LiveCSSEditor 4 года назад именно по этой причине.FireBug в Firefox позволил бы мне свободно писать CSS на странице, но в Chrome больше ничего не было бы.

Я все еще использую его сегодня и пока не нашел лучшего решения.Это может работать и для вас.:)

0 голосов
/ 17 июля 2011

Вы ищете это - Live Stylesheets

0 голосов
/ 24 сентября 2010

Пользователь Firebug Lite . Он также доступен как расширение для Chrome.

0 голосов
/ 24 сентября 2010

есть полуработающее расширение firebug , но оно еще не совсем идеально.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...