Emmet - как писать HTML и CSS быстрее
➡️ Telegram https://t.me/frontend_blog_tg
➡️ Доп. материалы и сообщество https://boosty.to/romanchebotaev
➡️ Менторинг https://frontend-blog.ru/services/men...
О видео
Шпаргалка: https://docs.emmet.io/cheat-sheet/
Сайт: https://emmet.io/
80% сценария и текста для видео написано ChatGPT
0:00 Вступление
0:57 HTML
4:33 CSS
5:49 Конец
Что такое Emmet
Плагин Emmet, также известный как Zen Coding, является инструментом для ускорения и упрощения процесса написания HTML и CSS кода. Он был разработан с целью повысить производительность веб-разработчиков и упростить создание макетов.
Emmet использует специальный синтаксис, который позволяет разрабатывать HTML и CSS код путем написания коротких аббревиатур и сокращений. Например, чтобы создать простую HTML таблицу с тремя строками и двумя столбцами, вам необходимо будет использовать следующую аббревиатуру: "table угловая скобка tr3 угловая скобка td2".
Кроме того, Emmet предоставляет возможность автоматического расширения аббревиатур в полноценный код. Например, если вы введете "ul угловая скобка li.item$*5", Emmet автоматически превратит эту аббревиатуру в HTML код с пятью элементами списка, пронумерованными от "item1" до "item5".
Emmet также поддерживает динамические аббревиатуры, которые могут быть использованы для создания разнообразного контента, такого как текст, изображения, ссылки и т.д. Например, аббревиатура "p угловая скобка .lorem10" создаст абзац с 10 словами из текста Lorem Ipsum.
Плагин Emmet широко поддерживается во многих популярных редакторах кода, таких как Visual Studio Code, Sublime Text, Atom, PhpStorm и других. Он является мощным инструментом для увеличения производительности и упрощения работы веб-разработчиков, позволяя им быстро и эффективно создавать различные элементы интерфейса и разметку веб-страниц.