Emmet
Learn about Emmet and how it speeds up the coding process.
Before we wrap up this chapter, let’s use the opportunity to take a look at another concept, Emmet.
What is Emmet?
Emmet is a way for a web developer to produce some common HTML and CSS code quickly. For example, if you open a brand new project, we’ll initially see that all coding areas are empty:
We don’t have a web page preview in the preview pane because we haven’t added any code.
Let’s change that by adding some boilerplate HTML code.
We’ll type one exclamation mark inside the HTML code area, !
.
This exclamation mark is an example of an Emmet abbreviation.
To quickly add code to our page, we need to expand Emmet abbreviations.
To expand any Emmet abbreviation, we usually press the “TAB” key. You need to ensure that the cursor is active and placed just to the immediate right of the abbreviation, without any space characters.
After ...