Emmet Cheat Sheet – HTML

Emmet Cheat Sheet summarized from: docs.emmet.io/cheat-sheet/.

Emmet Cheat Sheet summarized from: http://docs.emmet.io/cheat-sheet/. Deprecated tags in red.

Read more at: Emmet Cheat Sheet – Syntax, Emmet Cheat Sheet – CSS or Emmet Cheat Sheet – XSL.

Tags

! (alias of html:5)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

a

<a href=""></a>

a:link

<a href="http://"></a>

a:mail

<a href="mailto:"></a>

abbr

<abbr title=""></abbr>

acronym, acr

<acronym title=""></acronym>

base

<base href="" />

basefont

<basefont />

br

<br />

frame

<frame />

hr

<hr />

bdo

<bdo dir=""></bdo>

bdo:r

<bdo dir="rtl"></bdo>

bdo:l

<bdo dir="ltr"></bdo>

col

<col />

link

<link rel="stylesheet" href="" />

link:css

<link rel="stylesheet" href="style.css" />

link:print

<link rel="stylesheet" href="print.css" media="print" />

link:favicon

<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />

link:touch

<link rel="apple-touch-icon" href="favicon.png" />

link:rss

<link rel="alternate" type="application/rss+xml" title="RSS" href="rss.xml" />

link:atom

<link rel="alternate" type="application/atom+xml" title="Atom" href="atom.xml" />

link:import, link:im

<link rel="import" href="component.html" />

meta

<meta />

meta:utf

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

meta:win

<meta http-equiv="Content-Type" content="text/html;charset=windows-1251" />

meta:vp

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />

meta:compat

<meta http-equiv="X-UA-Compatible" content="IE=7" />

style

<style></style>

script

<script></script>

script:src

<script src=""></script>

img

<img src="" alt="" />

img:srcset, img:s

<img srcset="" src="" alt="" />

img:sizes, img:z

<img sizes="" srcset="" src="" alt="" />

picture

<picture></picture>

source, src

<source />

source:src, src:sc

<source src="" type="" />

source:srcset, src:s

<source srcset="" />

source:media, src:m

<source media="(min-width: )" srcset="" />

source:type, src:t

<source srcset="" type="image/" />

source:sizes, src:z

<source sizes="" srcset="" />

source:media:type, src:mt

<source media="(min-width: )" srcset="" type="image/" />

source:media:sizes, src:mz

<source media="(min-width: )" sizes="" srcset="" />

source:sizes:type, src:zt

<source sizes="" srcset="" type="image/" />

iframe

<iframe src="" frameborder="0"></iframe>

embed

<embed src="" type="" />

object

<object data="" type=""></object>

param

<param name="" value="" />

map

<map name=""></map>

area

<area shape="" coords="" href="" alt="" />

area:d

<area shape="default" href="" alt="" />

area:c

<area shape="circle" coords="" href="" alt="" />

area:r

<area shape="rect" coords="" href="" alt="" />

area:p

<area shape="poly" coords="" href="" alt="" />

form

<form action=""></form>

form:get

<form action="" method="get"></form>

form:post

<form action="" method="post"></form>

label

<label for=""></label>

input

<input type="text" />

inp

<input type="text" name="" id="" />

input:hidden, input:h (alias of input[type=hidden name])

<input type="hidden" name="" />

input:text, input:t (alias of inp)

<input type="text" name="" id="" />

input:search (alias of inp[type=search])

<input type="search" name="" id="" />

input:email (alias of inp[type=email])

<input type="email" name="" id="" />

input:url (alias of inp[type=url])

<input type="url" name="" id="" />

input:password, input:p (alias of inp[type=password])

<input type="password" name="" id="" />

input:datetime (alias of inp[type=datetime])

<input type="datetime" name="" id="" />

input:date (alias of inp[type=date])

<input type="date" name="" id="" />

input:datetime-local (alias of inp[type=datetime-local])

<input type="datetime-local" name="" id="" />

input:month (alias of inp[type=month])

<input type="month" name="" id="" />

input:week (alias of inp[type=week])

<input type="week" name="" id="" />

input:time (alias of inp[type=time]

<input type="time" name="" id="" />

input:tel (alias of inp[type=tel])

<input type="tel" name="" id="" />

input:number (alias of inp[type=number])

<input type="number" name="" id="" />

input:color (alias of inp[type=color])

<input type="color" name="" id="" />

input:checkbox, input:c (alias of inp[type=checkbox])

<input type="checkbox" name="" id="" />

input:radio, input:r (alias of inp[type=radio])

<input type="radio" name="" id="" />

input:range (alias of inp[type=range])

<input type="range" name="" id="" />

input:file, input:f (alias of inp[type=file])

<input type="file" name="" id="" />

input:submit, input:s

<input type="submit" value="" />

input:image, input:i

<input type="image" src="" alt="" />

input:button, input:b

<input type="button" value="" />

isindex

<isindex />

input:reset (alias of input:button[type=reset])

<input type="reset" value="" />

select

<select name="" id=""></select>

select:disabled, select:d (alias of select[disabled.])

<select name="" id="" disabled="disabled"></select>

option, opt

<option value=""></option>

textarea

<textarea name="" id="" cols="30" rows="10"></textarea>

marquee

<marquee behavior="" direction=""></marquee>

menu:context, menu:c (alias of menu[type=context]>)

<menu type="context"></menu>

menu:toolbar, menu:t (alias of menu[type=toolbar]>)

<menu type="toolbar"></menu>

video

<video src=""></video>

audio

<audio src=""></audio>

html:xml

<html xmlns="http://www.w3.org/1999/xhtml"></html>

keygen

<keygen />

command

<command />

button:submit, button:s, btn:s (alias of button[type=submit])

<button type="submit"></button>

button:reset, button:r, btn:r (alias of button[type=reset])

<button type="reset"></button>

button:disabled, button:d, btn:d (alias of button[disabled.])

<button disabled="disabled"></button>

fieldset:disabled, fieldset:d, fset:d, fst:d (alias of fieldset[disabled.])

<fieldset disabled="disabled"></fieldset>

bq (alias of blockquote)

<blockquote></blockquote>

fig (alias of figure)

<figure></figure>

figc (alias of figcaption)

<figcaption></figcaption>

pic (alias of picture)

<picture></picture>

ifr (alias of iframe)

<iframe src="" frameborder="0"></iframe>

emb (alias of embed)

<embed src="" type="" />

obj (alias of object)

<object data="" type=""></object>

cap (alias of caption)

<caption></caption>

colg (alias of colgroup)

<colgroup></colgroup>

fst, fset (alias of fieldset)

<fieldset></fieldset>

btn (alias of button)

<button></button>

optg (alias of optgroup)

<optgroup></optgroup>

tarea (alias of textarea)

<textarea name="" id="" cols="30" rows="10"></textarea>

leg (alias of legend)

<legend></legend>

sect (alias of section)

<section></section>

art (alias of article)

<article></article>

hdr (alias of header)*

<header></header>

ftr (alias of footer)

<footer></footer>

adr (alias of address)

<address></address>

dlg (alias of dialog)

<dialog></dialog>

str (alias of strong)

<strong></strong>

prog (alias of progress)

<progress></progress>

mn (alias of main)

<main></main>

tem (alias of template)

<template></template>

datag (alias of datagrid)

<datagrid></datagrid>

datal (alias of datalist)

<datalist></datalist>

kg (alias of keygen)

<keygen />

out (alias of output)

<output></output>

det (alias of details)

<details></details>

cmd (alias of command)

<command />

doc (alias of html>(head>meta[charset=${charset}]+title{${1:Document}})+body)

<html>
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

doc4 (alias of html>(head>meta[http-equiv="Content-Type" content="text/html;charset=${charset}"]+title{${1:Document}})+body)

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

ri:dpr, ri:d (alias of img:s)

<img srcset="" src="" alt="" />

ri:viewport, ri:v (alias of img:z)

<img sizes="" srcset="" src="" alt="" />

ri:art, ri:a (alias of pic>src:m+img)

<picture>
    <source media="(min-width: )" srcset="" />
    <img src="" alt="" />
</picture>

ri:type, ri:t (alias of pic>src:t+img)

<picture>
    <source srcset="" type="image/" />
    <img src="" alt="" />
</picture>

html:4t (alias of !!!4t+doc4[lang=${lang}])

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

html:4s (alias of !!!4s+doc4[lang=${lang}])

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

html:xt (alias of !!!xt+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}])

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

html:xs (alias of !!!xs+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}])

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

html:xxs (alias of !!!xxs+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}])

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

html:5 (alias of !!!+doc[lang=${lang}])

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
</head>
<body>

</body>
</html>

ol+ (alias of ol>li)

<ol>
    <li></li>
</ol>

ul+ (alias of ul>li)

<ul>
    <li></li>
</ul>

dl+ (alias of dl>dt+dd)

<dl>
    <dt></dt>
    <dd></dd>
</dl>

map+ (alias of map>area)

<map name="">
    <area shape="" coords="" href="" alt="" />
</map>

table+ (alias of table>tr>td)

<table>
    <tr>
        <td></td>
    </tr>
</table>

colgroup+, colg+ (alias of colgroup>col)

<colgroup>
    <col />
</colgroup>

tr+ (alias of tr>td)

<tr>
    <td></td>
</tr>

select+ (alias of select>option)

<select name="" id="">
    <option value=""></option>
</select>

optgroup+, optg+ (alias of optgroup>option)

<optgroup>
    <option value=""></option>
</optgroup>

pic+ (alias of picture>source:srcset+img)

<picture>
    <source srcset="" />
    <img src="" alt="" />
</picture>

!!!

<!DOCTYPE html>

!!!4t

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

!!!4s

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

!!!xt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

!!!xs

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

!!!xxs

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

c

<!-- ${child} -->

cc:ie6

<!--[if lte IE 6]>
    ${child}
<![endif]-->

cc:ie

<!--[if IE]>
    ${child}
<![endif]-->

cc:noie

<!--[if !IE]><!-->
    ${child}
<!--<![endif]-->

Posted in Emmet, Sublime Text on Apr 07, 2016