What is Emmet?
Emmet
is a web development toolkit that enables developers to write HTML and CSS code more quickly and efficiently
.
- It allows you to type shortcuts
that are then expanded into full pieces of code for writing HTML and CSS
, based on an abbreviation structure most developers already use that expands into full-fledged HTML markup and CSS rules.
- It was originally a plugin
for various text editors, such as Sublime Text, Visual Studio Code, and Atom, but it has become a widely adopted set of tools integrated into many modern code editors.
Example:
Input:
ul>.my-class
Output:
<ul>
<li class="my-class"></li>
</ul>
Input:
ul>li*3>a
Output:
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
This expands into an unordered list(ul)
with three list items(li), each containing an anchor(a)
element.
Subscribe to my newsletter
Read articles from Bharat Kumar directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by
Bharat Kumar
Bharat Kumar
I am a frontend developer.