Список сокращений плагина Emmet для быстрого написания кода html css

Сокращения из плагина Emmet используется во многих редакторах кода: VS Code, Sublime Text, PHPStorm, Brackets при написании кода html или css. В некоторых редакторах плагин идет по умолчанию, а в некоторых редакторах его придется устанавливать отдельно. Плагин позволяет при написании кода использовать сокращения и выводить уже готовые конструкции.

Так, например, если у вас установлен плагин emmet и включен редактор кода (открыта страница html), то достаточно добавить “восклицательный знак (!)” и нажать клавишу tab, то получите в редакторе уже готовую конструкцию:

Запомните, все сокращения раскрываются по нажатию клавиши tab.

Сокращения:	Конструкция (код):
nav>ul>li	[html] <nav> <ul> <li></li> </ul> </nav> [/html]
*ul>li5**	[html] <ul> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> [/html]
div+p+bq	[html] <div></div> <p></p> <blockquote></blockquote> [/html]
#header .title	[html] <div id="header"></div> [/html] [html] <div class="title"></div> [/html]
div+div>p>span+em^bq	[html] <div></div> <div> <p><span></span><em></em></p> <blockquote></blockquote> </div> [/html]
*ul>li.item$5**	[html] <ul> <li class="item1"></li> <li class="item2"></li> <li class="item3"></li> <li class="item4"></li> <li class="item5"></li> </ul> [/html]
td[rowspan=2 colspan=3 title]	[html] <td rowspan="2" colspan="3" title=""></td> [/html]
*div>(header>ul>li2>a)+footer>p**	[html] <div> <header> <ul> <li><a href=""></a></li> <li><a href=""></a></li> </ul> </header> <footer> <p></p> </footer> </div> [/html]
a{Click me}	[html] <a href="">Click me</a> [/html]

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

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