Implicit tag names

Even with such a powerful abbreviation engine, which can expand large HTML structures from short abbreviation, writing tag names may be very tedious.

In many cases you can skip typing tag names and Emmet will substitute it for you. For example, instead of div.content you can simply write .content and expand it into <div class="content"></div>.

How it works

When you expand abbreviation, Emmet tries to grab parent context, e.g. the HTML element, inside which you’re expanding the abbreviation. If the context was grabbed successfully, Emmet uses its name to resolve implicit names:

As you can see from the example above, Emmet looks at the parent tag name every time you’re expanding the abbreviation with an implicit name. Here’s how it resolves the names for some parent elements:

Take a look at some abbreviations equivalents with implicit and explicit tag names:

.wrap>.content div.wrap>div.content
em>.info em>
ul>.item*3 ul>li.item*3
table>#row$*4>[colspan=2] table>tr#row$*4>td[colspan=2]
comments powered by Disqus