Найти в Дзене

​​Ускоряем написание HTML разметки с помощью Emmet в VSCode


Emmet - это утилита, которая позволяет значительно ускорить ваш рабочий процесс с HTML. Просто введите любой тег без <> и нажмите TAB, в результате получите полноценную HTML разметку с обязательными атрибутами и закрывающим тегом. Рассмотрим популярные сокращения:

1. Вводим ! и нажимаем TAB, далее происходит магия и мы получаем разметку целой страницы.

2. Вводим html, получаем:
<html>

3. Добавляем несколько братских элементов - h1+h2+p+btn, получаем:
<h1></h1>
<h2></h2>
<p></p>
<button></button>

3. Добавляем дочерние элементы - table>tr>td:
<table>
<tr>
<td></td>
</tr>
</table>

4. Умножение - ul>li*3:
<ul>
<li></li>
<li></li>
<li></li>
</ul>

Это лишь часть возможностей Emmet. Изучайте и становитесь продуктивнее.

Ссылки:
​​Ускоряем написание HTML разметки с помощью Emmet в VSCode  Emmet - это утилита, которая позволяет значительно ускорить ваш рабочий процесс с HTML.
Около минуты