Emmet — плагин для Sublime Text

st emmet demo - Emmet — плагин для Sublime Text

Данный код я развернул при помощи всего двух клавиш — восклицательного знака и табуляции. Это одна из возможностей плагина Emmet для Sublime Text. Он представляет из себя набор сокращений для HTML и CSS языков. Например, печатаем внутри стиля tac и жмем табуляцию. Строка превращается в:

text-aligm:center;
st emmet cutes - Emmet — плагин для Sublime Text
CSS сокращения для плагина Emmet

Это набор наиболее часто используемых мною стилей при верстке шаблонов. Emmet оказался очень кстати и я навсегда забыл, что такое набор всех этих строк вручную. После разворачивания всех строк табуляцией, класс будет выглядеть следующим образом:

st emmet opened - Emmet — плагин для Sublime Text

Для HTML есть тоже куча разных сокращений, например, когда нужно создать div-class в коде я набираю вот так: .anyclass и нажимаю табуляцию. После чего строка разворачивается до полного вида, где каретка находится внутри тегов:

<div class="anyclass"></div>

или, например, вот такая комбинация:

div#page>div.logo+ul#navigation>li*5>a

развернет вот такой блок кода:

<div id="page">        
	<div class="logo"></div>        
	<ul id="navigation">                
		<li><a href=""></a></li>                
		<li><a href=""></a></li>                
		<li><a href=""></a></li>                
		<li><a href=""></a></li>                
		<li><a href=""></a></li>        
	</ul>
</div>

Здесь так же предусмотрена и легендарная фраза Lorem ipsum dolor… , которая разворачивается при наборе первого слова, а если фраз нужно много, то ставим знак умножения: lorem*6 + tab.

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

Официальный сайт: http://docs.emmet.io/

Читайте также

Похожие записи

Sublime Text — подборка лучших Flat и Material тем оформления
Уже довольно продолжительное время такие продукты, как Android и Windows диктуют нам тренды в дизайне. И, хочу сказать, очень даже...
Sublime Text — набор необходимых плагинов для повседневной работы
Уникальный редактор исходного кода на настройку которого в свое время я потратил не один месяц. Даже сейчас периодически узнаю разные...
Сниппеты в Sublime Text, настройка сниппетов
Добрался я и до сниппетов. Очень удобная штука, когда нужно один и то же код постоянно применять в разных файлах,...
Sublime Text — моя светлая цветовая схема в цветах Notepad2
Долгое время пользовался редактором Notepad2 и очень сильно привязался к цветовой схеме этого редактора. Позже перешел на Sublime Text и...
Color Highlighter + Color Picker — плагины для Sublime Text
Два отдельных плагина для Sublime Text, которые лучше всего устанавливать сразу. Описания для каждого из плагинов нужно не много, смысл...

Комментарии

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *