Emmet
Принцип работы Emmet: наберите тэг без угловых скобок и нажмите Tab — набранная заготовка превратится в полноценный тэг.
Поэкспериментируйте с такими примерами:
html:5 img p(img) ul>li ul.my-list>li*3>a.item$ div.row.center>(div.col-lg-4>img)+(div.col-lg-8)
То же самое возможно в интерактивном режиме: Ctrl+Alt+Enter
Кроме того, Emmet добавляет удобные горячие клавиши для редактирования тэгов:
| Выделить тэг внутрь | Ctrl+, |
| Выделить тэг наружу | Ctrl+Shift+0 |
| Переименовать тэг | Ctrl+Shift+' |
| Удалить тэг | Ctrl+Shift+; |
| Закомментировать или раскомментировать тэг |
Ctrl+Shift+/ |