Форма авторизации

HTML Designer для Brackets

Swagatam Mitra
HTML Designer для Brackets
Расширение для редактора кода Brackets, которое предназначено для проектирования и настройки веб-интерфейса с HTML и CSS.

Особенности
  • WYSIWYG design editor to design and customize HTML pages
  • Rendering of HTML page with Split view support for stylesheet editing and HTML page source editing
  • Illustration controls for popular CSS properties like -
  • - Layout ( BoxModel)
  • - - All CSS layout support
  • - - Reference anchoring change by retaining current position( when element is positioned)
  • - - Layouting parameters change by retaining current position
  • - - Intelligent unit persistance and incr/decr logic based on unit present in target selector
  • - Background Properties
  • - Shadow Properties
  • - Transformation properties
  • - Border Properties
  • - Transition Animation(with Preview)
  • - CSS3 Keyframe animation(With Preview)
  • Automatic CSS selector selection based on specificity for property change persistence
  • User can override tools automatic selection for property change presistense
  • Drag Selection to position ( Decision tree driven property selection for positioning a positioned or non-positioned element )
  • Drag Resize controls to Resize
  • Precise positioning by using arrow keys to shift by 1 pixel
  • Precise Resizing by using shift+arrow keys to increase/decrease height/width by 1 pixel
  • Shift+Drag to change containment
  • Alt+Click to do layered selection
  • Element serach by using jquery selector
  • On-Demand sandboxing of application iFrame to stop JS execution
  • HTML attribute editing using intutive input controls
  • Drag Border radius control points to change radius for one corner
  • Shift+Drag Border radius control point to change radius for all corners
  • Ctrl+Drag to copy/Clone ( nested )
  • Double Click a selected element to open inner HTML editor non-modal popup
  • MultiSelect by Ctrl+Click
  • Multiselect by drawing control rect
  • Alignment on multiselected elements
  • Cut/Copy/Paste of elements using context menu


Информация Наложение
  • Offset Markers with Offset values
  • Element position reference axis ( x and y)
  • Current containment and prospective containment based on mouse interaction while editing containment using Shift+Drag
  • Border radius focal point for rx and ry
  • Selection Rectangle


Линейка и Сетка
  • Ruler and Grid support with pixel calibration
  • On Demand grids by clicking on Rulers
  • Dynamic position of Grids drawn
  • Lockable grid lines
  • Show/Hide of Grid lines
  • Clear Grid lines
  • Options accessible from right click context menu at grid corner block
















Рекомендации
Рекомендуем после установки расширения, проверить его на обновление более новой версии при помощи МЕНЕДЖЕР РАСШИРЕНИЙ. Если расширение не имеет более нового обновления, значит вы используете последнюю версию.
Установка
Способ 1:
1. Скачать архив расширения
2. Запустить редактор Brackets
3. Распаковать скачанный архив в папку /user/. Как найти папку /user/ ?
    В редакторе Brackets выбираем вкладку ПОМОЩЬ > ПОКАЗАТЬ ДИРЕКТОРИЮ РАСШИРЕНИЙ
4. Распаковываем.
5. После распаковки у вас появится новая папка с названием расширения в директории /user/.
6. Перезапускаем редактор Brackets
7. Радуемся установленному расширению.
Способ 2:
1. Запустить редактор Brackets
2. Переходим во вкладку ФАЙЛ > МЕНЕДЖЕР РАСШИРЕНИЙ
3. В появившемся окне, в поле ПОИСК вводим - html-designer
4. Нажимаем УСТАНОВИТЬ.
5. Начнется загрузка и установка расширения.
6. По завершению установки, редактор Brackets перезапустится.
    Если этого не произошло - перезагружаем вручную.
7. Радуемся установленному расширению.
Комментарии к материалу
Всего комментариев: 0

avatar