BEST USEFUL EMMET ABBREVIATIONS
7 min
May 23 2021
There are many web developers who start and spend a lot of time on the same boring HTML code, but after reading the article, the coding process will become faster for you, so here are some Emmett abbreviations. Before moving on, let me explain what Emmett is. Emmet is a set of plugins that is very useful for web developers to perform high-speed coding, we just need to write small abbreviations and Emmet will automatically complete for you.
1) .container (.className) : This will make a div with the class name of container.
Best useful emmet abbreviations
2) #container (#idName) : This will make a div with the id of container.
Best useful emmet abbreviations
3.) .header>(div.links>a{Google})+.footer : This will make a div with header class and then inside it, there will be 2 elements created, a div with links class name and an a tag which will have the content Google and a footer as a sibling of the .links div
Best useful emmet abbreviations 1
4.) .main>.top+.bottom : This will make a div with the main class and then make two sibling elements a div with top class and a div with bottom class.
Best useful emmet abbreviations 2
5) .header>ul>li*4 : This will make a div with a class of header and then nest a ul tag which will consist of 4 li tags.
Best useful emmet abbreviations 3
Thank you very much for reading, I hope this article was useful for you. Good luck and have a nice day!
BLOG LATEST
Popular articles
GOT AN IDEA? LET'S DISCUSS!
Share your project’s scope, timeline, technical requirements, business challenges, and other details you consider necessary. Our team will study them and contact you soon. Let’s make an exciting product together!
By sending this form I confirm that I have read and accept the Privacy Policy
WELCOME TO OUR OFFICES
Georgia
Russia