Inline Editor css

Быстрый редактор CSS в Brackets

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


Как использовать Inline editor (Быстрый редактор CSS) в brackets?

Открывается аккордеон (быстрое редактирование) точно так же как и html из предыдущей статьи, сочетанием клавиш Ctrl+E. Работает данная функция не с тегами а цветами, градиентами или даже анимацией.  При нажатии кнопок открытия быстрого редактирования на местах не относящихся к цвету/анимации мы получаем ошибку:

Быстрое редактирование недоступно в данной позиции курсора.

Поэтому перемещаем курсор на цвет любого формата будь то rgb, hex или вообще название цвета словом. Последнее кстати при перемещении превратится в hex формат (#rrggbb), по умолчанию.

функции быcтрого редактирования цвета в редакторе кода brackets

Вообще редактор выглядит довольно-таки минималистичным, но имеет всё необходимое чего так не хватает аналогичным программам. А это и список цветов которые уже используются в документе (справа), и ползунок прозрачности который при малейшем сдвиге переводит цвет в grba (прозрачность).

функции быстрого редактирования прозрачности opacity в редакторе кода brackets

Снизу имеются поддерживаемые кодировки, то есть можно переключаться между ними без каких-то там изменений цвета за один клик. Чуть левее поле для ввода или копирования, куда можно вставить уже готовый цвет для дальнейшей работы над ним.


Быстрая настройка анимации в brackets:

Здесь всё намного более просто нежели с цветом. Жмем Ctrl+E на анимации которую нужно отредактировать и получаем готовый редактор (на данный момент кривых безье). Того минимума что предоставляет brackets зачастую будет достаточно для качественной настройки анимации.

быстрый редактор css функции быстрого редактирования крывых безье, анимации в редакторе кода brackets


 

Добавить комментарий

Ваш e-mail не будет опубликован.