Интернет магазин шабонов
Форма входа

Статьи сайта

Подробный инспектор CSS на каждом сайте с CSSPeeper для Chrome


 
Панель Chrome DevTools безупречна. Она позволяет любому пользователю углубиться в любую страницу сайта, чтобы изучить структуру сайта, CSS и даже HTTP-заголовки, если это необходимо.

Вы можете многое сделать с помощью инспектора CSS DevTools. Но у него нет четкой панели графического интерфейса, и это то, что обожает любой разработчик.

Ознакомьтесь с бесплатным расширением Chrome - CSSPeeper, которое добавляет инспектор графического интерфейса в ваш браузер. Он позволяет изучать свойства CSS любого элемента на любой странице, он создан только для Chrome.

После установки вы просто заходите на веб-страницу и щелкаете основной кнопкой расширения на панели надстроек Chrome. На верхней части веб-страницы появляется новое окно инспектора с подробными сведениями о каждом основном элементе.

Когда вы просматриваете сайт, вы можете щелкнуть по любому элементу, который вы видите пунктирным контуром. Оно может включать в себя кнопки, разделы страниц, заголовки, элементы навигации.
 

Оттуда вы получите целый инспектор с подробностями о типографии, цветовых решениях и стилях шрифтов. Это отличный способ вытащить стили непосредственно с веб-страницы, не копаясь самостоятельно в коде CSS.

CSSPeeper позволяет даже выбирать соответствующие цвета с помощью встроенного набора цветов и генератора цветовой схемы. Вы можете экспортировать изображения со страниц, создавать свои собственные цветовые схемы и применять их в своих макетах с помощью Photoshop или Sketch.
 

В первую очередь я рекомендую это расширение для дизайнеров вместо разработчиков, так как это гораздо более удобный для дизайнеров плагин, который вытягивает необработанный CSS и преобразует код в легко читаемые фрагменты данных.

Но этот плагин также может помочь разработчикам! Это действительно мощный инструмент проверки сайта для всех типов CSS.

Взгляните на домашнюю страницу CSSPeeper, чтобы узнать больше о том, что она может сделать. На главной странице также есть ссылка на магазин Chrome, поэтому вы можете бесплатно установить расширение.
Поделись с друзьями:
Добавлять комментарии могут только зарегистрированные пользователи.