Emmet

Увеличиваем/уменьшаем значения:

Сокращения

div>ul>li


    

div+p+bq


    

div+div>p>span+em


	

div+div>p>span+em^bq


div+div>p>span+em^^^bq


ul>li*5


div>(header>ul>li*2>a)+footer>p


(div>dl>(dt+dd)*3)+footer>p


div#header+div.page+div#footer.class1.class2.class3



td[title="Hello world!" colspan=3]



ul>li.item$*5


ul>li.item$$$*5


a{Click me}


Click me

a{click}+b{here} and a>{click}+b{here}



clickhere

clickhere

p>{Click }+a{here}+{ to continue}


Click here to continue

p{Click }+a{here}+{ to continue}


Click

here to continue

  

CSS сокращения

Как я понял, посмотреть на большие возможности можно в snippets.json

Префиксы

-bdrs

-webkit-border-radius: ;
-moz-border-radius: ;
border-radius: ;

 -super-foo

-webkit-super-foo: ;
-moz-super-foo: ;
-ms-super-foo: ;
-o-super-foo: ;
super-foo: ;

 -trf

transform

 

Генератор “Lorem Ipsum”

p*4>lorem

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui dicta minus molestiae vel beatae natus eveniet ratione temporibus aperiam harum alias officiis assumenda officia quibusdam deleniti eos cupiditate dolore doloribus!

Ad dolore dignissimos asperiores dicta facere optio quod commodi nam tempore recusandae. Rerum sed nulla eum vero expedita ex delectus voluptates rem at neque quos facere sequi unde optio aliquam!

Tenetur quod quidem in voluptatem corporis dolorum dicta sit pariatur porro quaerat autem ipsam odit quam beatae tempora quibusdam illum! Modi velit odio nam nulla unde amet odit pariatur at!

Consequatur rerum amet fuga expedita sunt et tempora saepe? Iusto nihil explicabo perferendis quos provident delectus ducimus necessitatibus reiciendis optio tempora unde earum doloremque commodi laudantium ad nulla vel odio?

ul.generic-list>lorem10.item*4

 

Неявные имена тэгов

Можно не писать имя тега, система интуитивно вставит нужное.

.wrap>.content div.wrap>div.content
em>.info em>span.info
ul>.item*3 ul>li.item*3
table>#row$*4>[colspan=2] table>tr#row$*4>td[colspan=2]

Yandex BEM/OOCSS

Да он еще умеет превращать в яндексовский БЭМ. Но у меня пока душа не лежит к нему, так что писать не буду, увы)

Настройка

snippets.json
обновляем или добавляем сниппеты

preferences.json
меняем поведение некоторых фильтров и действий Эммета

syntaxProfiles.json
определяем, как должен выглядить сгенерированный html/xml

 

пруф линк http://docs.emmet.io/