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, которые лучше всего устанавливать сразу. Описания для каждого из плагинов нужно не много, смысл...

Комментарии

Бесполезно писать спамные сообщения. Все комментарии проверяются;
Можно оставлять ссылки (через <a href), если они несут полезную информацию или дополняют статью;

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

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