Emmet Cheat Sheet

Cheat Sheet
http://docs.emmet.io/cheat-sheet/[17/02/2013 12:03:50]
Emmet Documentation
Syntax
Child: >
nav>ul>li
Sibling: +
div+p+bq
Climb-up: ^
div+div>p>span+em^bq
div+div>p>span+em^^bq
Grouping: ()
div>(header>ul>li*2>a)+footer>p
(div>dl>(dt+dd)*3)+footer>p
h$[title=item$]{Header $}*3
ul>li.item$$$*5
ID and CLASS attributes
#header
.title
form#search.wide
p.class1.class2.class3
Custom attributes
p[title="Hello world"]
td[rowspan=2 colspan=3 title]
[a='value1' b="value2"]
Text: {}
a{Click me}
p>{Click }+a{here}+{ to continue}
Implicit tag names
<nav>
<ul>
<li></li>
</ul>
</nav>
<div></div>
<p></p>
<blockquote></blockquote>
<div></div>
<div>
<p><span></span><em></em></p>
</div>
<div></div>
<div>
<p><span></span><em></em></p>
</div>
<div>
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</header>
<footer>
<p></p>
</footer>
</div>
<div>
<dl>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
</dl>
</div>
Cheat Sheet
Multiplication: *
ul>li*5
Item numbering: $
ul>li.item$*5
.class
em>.class
ul>.class
table>.row>.col
HTML
All unknown abbreviations will be transformed to tag, e.g. foo <foo></foo>.
!
a
a:link
a:mail
abbr
acronym
base
bdo
bdo:r
cap
colg
fst, fset
btn
optg
opt
tarea
<footer>
<p></p>
</footer>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul>
<li class="item1"></li>
</ul>
<h1 title="item1">Header 1</h1>
<ul>
</ul>
<div id="header"></div>
<div class="title"></div>
<form id="search" class="wide"></form>
<p class="class1 class2 class3"></p>
<p title="Hello world"></p>
<td rowspan="2" colspan="3" title=""></td>
Alias of html:5
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> Document </title>
</head>
<body>

</body>
</html>
<a href=" "> </a>
<a href="http:// "> </a>
<a href="mailto: "> </a>
<abbr title=" "> </abbr>
<acronym title=" "> </acronym>
<base href=" " />
<bdo dir=" "> </bdo>
Cheat Sheet
bdo:l
link
link:css
link:print
link:favicon
link:touch
link:rss
link:atom
meta:utf
meta:win
meta:compat
style
script
script:src
img
iframe
leg
sect
art
hdr
ftr
adr
dlg
str
prog
datag
datal
kg
out
<div a="value1" b="value2"></div>
<a href="">Click me</a>
<p>Click <a href="">here</a> to continue</p>
<div class="class"></div>
<em><span class="class"></span></em>
<ul>
<li class="class"></li>
</ul>
<table>
<tr class="row">
<td class="col"></td>
</tr>
</table>
<bdo dir="rtl"> </bdo>
<bdo dir="ltr"> </bdo>
<link rel="stylesheet" href=" " />
<link rel="stylesheet" href=" style .css"
media="all" />
<link rel="stylesheet" href=" print .css"
media="print" />
<link rel="shortcut icon" type="image/x-icon"
href=" favicon.ico " />
<link rel="apple-touch-icon" href=" favicon.png "
/>
<link rel="alternate" type="application/rss+xml"
title="RSS" href=" rss.xml " />
<link rel="alternate" type="application/atom+xml"
title="Atom" href=" atom.xml " />
<meta http-equiv="Content-Type"
content="text/html;charset=UTF-8" />
content="text/html;charset=windows-1251" />
<meta http-equiv="X-UA-Compatible" content=" IE=7
" />
<style> </style>
<script> </script>
<script src=" "> </script>
<img src=" " alt=" " />
<iframe src=" " frameborder="0"> </iframe>
Cheat Sheet
embed
object
param
map
area
area:d
area:c
area:r
area:p
form
form:get
form:post
label
input
input:hidden, input:h
input:text, input:t
input:search
input:email
input:url
det
cmd
ol+
ul+
dl+
map+
table+
colgroup+, colg+
tr+
select+
<embed src=" " type=" " />
<object data=" " type=" "> </object>
<param name=" " value=" " />
<map name=" "> </map>
<area shape=" " coords=" " href=" " alt=" " />
<area shape="default" href=" " alt=" " />
<area shape="circle" coords=" " href=" " alt=" "
/>
<area shape="rect" coords=" " href=" " alt=" " />
<area shape="poly" coords=" " href=" " alt=" " />
<form action=" "> </form>
<form action=" " method="get"> </form>
<form action=" " method="post"> </form>
<label for=" "> </label>
<input type=" " />
<input type="hidden" name=" " />
<input type="text" name=" " id=" " />
<input type="search" name=" " id=" " />
<input type="email" name=" " id=" " />
<input type="url" name=" " id=" " />
Cheat Sheet
input:password, input:p
input:datetime
input:date
input:datetime-local
input:month
input:week
input:time
input:number
input:color
input:checkbox, input:c
input:radio, input:r
input:range
input:file, input:f
input:submit, input:s
input:image, input:i
input:reset
input:button, input:b
select
option
optgroup+, optg+
c
cc:ie6
cc:ie
cc:noie
html:4t
html:4s
html:xt
<input type="password" name=" " id=" " />
<input type="datetime" name=" " id=" " />
<input type="date" name=" " id=" " />
<input type="datetime-local" name=" " id=" " />
<input type="month" name=" " id=" " />
<input type="week" name=" " id=" " />
<input type="time" name=" " id=" " />
<input type="number" name=" " id=" " />
<input type="color" name=" " id=" " />
<input type="checkbox" name=" " id=" " />
<input type="radio" name=" " id=" " />
<input type="range" name=" " id=" " />
<input type="file" name=" " id=" " />
<input type="submit" value=" " />
<input type="image" src=" " alt=" " />
<input type="reset" value=" " />
<input type="button" value=" " />
<select name=" " id=" "> </select>
<option value=" "> </option>
Cheat Sheet
textarea
menu:context, menu:c
menu:toolbar, menu:t
video
audio
html:xml
bq
acr
fig
figc
ifr
emb
obj
src
html:xs
html:xxs
html:5
CSS
CSS module uses fuzzy search to find unknown abbreviations, e.g. ov:h == ov-h == ovh == oh.
If abbreviation wasnt found, it is transformed into property name: foo-bar foo-bar: |;
<textarea name=" " id=" " cols=" 30 " rows=" 10 ">
</textarea>
<menu type="context"> </menu>
<menu type="toolbar"> </menu>
<video src=" "> </video>
<audio src=" "> </audio>
<html xmlns="http://www.w3.org/1999/xhtml">
</html>
Alias of blockquote
<blockquote> </blockquote>
Alias of acronym
<acronym title=" "> </acronym>
Alias of figure
<figure> </figure>
Alias of figcaption
<figcaption> </figcaption>
Alias of iframe
<iframe src=" " frameborder="0"> </iframe>
Alias of embed
<embed src=" " type=" " />
Alias of object
<object data=" " type=" "> </object>
Alias of source
<source> </source>
Alias of caption
Cheat Sheet
pos
pos:s
pos:a
pos:r
pos:f
t
t:a
r
r:a
b
b:a
l
l:a
z
z:a
fl
fl:n
fl:l
fl:r
cl
cl:n
cl:l
cl:r
cl:b
d
d:n
d:b
d:i
d:ib
d:li
d:ri
d:cp
d:tb
d:itb
whsc:bs
whsc:ba
wob
wob:n
wob:k
wob:l
wob:bs
wob:ba
wos
wow
wow:nm
wow:n
wow:u
wow:s
bg
bg+
bg:n
bgc
bgi
bgi:n
bgr
bgr:n
bgr:x
bgr:y
bga
bga:f
bga:s
bgp
bgpx
bgpy
bgbk
bgbk:bb
bgbk:eb
You can prefix abbreviations with hyphen to produce vendor-prefixed properties: -foo
Visual Formatting
Background
<caption> </caption>
Alias of colgroup
<colgroup> </colgroup>
Alias of fieldset
<fieldset> </fieldset>
Alias of button
<button> </button>
Alias of optgroup
<optgroup> </optgroup>
Alias of option
Alias of textarea
<textarea name=" " id=" " cols=" 30 " rows=" 10 ">
</textarea>
Alias of legend
<legend> </legend>
Alias of section
<section> </section>
Alias of article
<article> </article>
Alias of header
<header> </header>
Alias of footer
<footer> </footer>
Alias of address
<address> </address>
Alias of dialog
position: ;
position:static;
position:absolute;
position:relative;
position:fixed;
top: ;
top:auto;
right: ;
right:auto;
bottom: ;
bottom:auto;
left: ;
left:auto;
z-index: ;
z-index:auto;
float: ;
float:none;
float:left;
float:right;
clear: ;
clear:none;
clear:left;
clear:right;
clear:both;
display: ;
display:none;
display:block;
display:inline;
display:inline-block;
display:list-item;
display:run-in;
display:compact;
display:table;
display:inline-table;
Cheat Sheet
d:tbcp
d:tbcl
d:tbclg
d:tbhg
d:tbfg
d:tbr
d:tbrg
d:tbc
d:rb
d:rbb
d:rbbg
d:rbt
d:rbtg
v
v:v
v:h
v:c
ov
ov:v
ov:h
ov:s
ov:a
ovx
ovx:v
ovx:h
ovx:s
ovx:a
ovy
ovy:v
ovy:h
ovy:s
ovy:a
ovs
ovs:a
ovs:s
ovs:p
ovs:m
bgbk:c
bgcp
bgcp:bb
bgcp:pb
bgcp:cb
bgcp:nc
bgo
bgo:pb
bgo:bb
bgo:cb
bgz
bgz:a
bgz:ct
bgz:cv
c
op
cn, ct
ct:n
ct:oq
ct:noq
ct:cq
ct:ncq
ct:a
ct:c
ct:cs
q
q:n
q:ru
q:en
coi
cor
Color
Generated content
Outline
<dialog> </dialog>
Alias of strong
<strong> </strong>
Alias of progress
<progress> </progress>
Alias of datagrid
<datagrid> </datagrid>
Alias of datalist
<datalist> </datalist>
Alias of keygen
<keygen />
Alias of output
<output> </output>
Alias of details
<details> </details>
Alias of command
<command />
Alias of ol>li
<ol>
<li> </li>
</ol>
Alias of ul>li
<ul>
<li> </li>
</ul>
Alias of dl>dt+dd
<dl>
<dt> </dt>
<dd> </dd>
</dl>
display:table-caption;
display:table-column;
display:table-column-group;
display:table-header-group;
display:table-footer-group;
display:table-row;
display:table-row-group;
display:table-cell;
display:ruby;
display:ruby-base;
display:ruby-base-group;
display:ruby-text;
display:ruby-text-group;
visibility: ;
visibility:visible;
visibility:hidden;
visibility:collapse;
overflow: ;
overflow:visible;
overflow:hidden;
overflow:scroll;
overflow:auto;
overflow-x: ;
overflow-x:visible;
overflow-x:hidden;
overflow-x:scroll;
overflow-x:auto;
overflow-y: ;
overflow-y:visible;
overflow-y:hidden;
overflow-y:scroll;
overflow-y:auto;
overflow-style: ;
overflow-style:auto;
overflow-style:scrollbar;
overflow-style:panner;
overflow-style:move;
Cheat Sheet
ovs:mq
zoo
cp
cp:a
cp:r
rz
rz:n
rz:b
rz:h
rz:v
cur
cur:a
cur:d
cur:c
cur:ha
cur:he
cur:m
cur:p
cur:t
m
m:a
mt
mt:a
mr
mr:a
mb
mb:a
ml
ml:a
p
pt
pr
pb
pl
o
o:n
oo
ow
os
oc
oc:i
tbl
tbl:a
tbl:f
cps
cps:t
cps:b
ec
ec:s
ec:h
bd
bd+
bd:n
bdbk
bdbk:c
bdcl
bdcl:c
bdcl:s
bdc
bdi
bdi:n
bdti
bdti:n
bdri
bdri:n
bdbi
bdbi:n
bdli
Margin & Padding
Box Sizing
Tables
Border
Alias of map>area
<map name=" ">
<area shape=" " coords=" " href=" " alt=" " />
</map>
Alias of table>tr>td
<table>
<tr>
<td> </td>
</tr>
</table>
Alias of colgroup>col
<colgroup>
<col />
</colgroup>
Alias of tr>td
<tr>
<td> </td>
</tr>
Alias of select>option
<select name=" " id=" ">
</select>
Alias of optgroup>option
<optgroup>
</optgroup>




${child}

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
overflow-style:marquee;
zoom:1;
clip: ;
clip:auto;
clip:rect( );
resize: ;
resize:none;
resize:both;
resize:horizontal;
resize:vertical;
cursor: ;
cursor:auto;
cursor:default;
cursor:crosshair;
cursor:hand;
cursor:help;
cursor:move;
cursor:pointer;
cursor:text;
margin: ;
margin:auto;
margin-top: ;
margin-top:auto;
margin-right: ;
margin-right:auto;
margin-bottom: ;
margin-bottom:auto;
margin-left: ;
margin-left:auto;
padding: ;
padding-top: ;
padding-right: ;
padding-bottom: ;
padding-left: ;
Cheat Sheet
bxz
bxz:cb
bxz:bb
bxsh
bxsh:n
w
w:a
h
h:a
maw
maw:n
mah
mah:n
miw
mih
f
f+
fw
fw:n
fw:b
fw:br
fw:lr
fs
fs:n
fs:i
fs:o
fv
fv:n
fv:sc
fz
fza
fza:n
ff
ff:s
ff:ss
bdli:n
bdci
bdci:n
bdci:c
bdtli
bdtli:n
bdtli:c
bdtri
bdtri:n
bdtri:c
bdbri
bdbri:n
bdbri:c
bdbli
bdbli:n
bdbli:c
bdf
bdf:c
bdf:r
bdf:sc
bdf:st
bdf:ow
bdf:of
bdf:sp
bdl:a
bdsp
bds
bds:n
bds:h
bds:dt
bds:ds
bds:s
bds:db
bds:dtds
bds:dtdtds
bds:w
bds:g
Font
Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="${lang}">
<head>
content="text/html;charset=${charset}">
</head>
<body>
${child}
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<head>
content="text/html;charset=${charset}">
</head>
<body>
${child}
</body>
</html>
<!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="${lang}">
<head>
content="text/html;charset=${charset}" />
<title></title>
</head>
<body>
${child}
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-
strict.dtd">
xml:lang="${lang}">
<head>
</head>
<body>
${child}
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
box-sizing: ;
box-sizing:content-box;
box-sizing:border-box;
box-shadow: hoff voff radius
color ;
box-shadow:none;
width: ;
width:auto;
height: ;
height:auto;
max-width: ;
max-width:none;
max-height: ;
max-height:none;
min-width: ;
min-height: ;
font: ;
font: 1em Arial,sans-serif ;
font-weight: ;
font-weight:normal;
font-weight:bold;
font-weight:bolder;
font-weight:lighter;
font-style: ;
font-style:normal;
font-style:italic;
font-style:oblique;
font-variant: ;
font-variant:normal;
font-variant:small-caps;
font-size: ;
font-size-adjust: ;
font-size-adjust:none;
font-family: ;
font-family:serif;
font-family:sans-serif;
Cheat Sheet
ff:c
ff:f
ff:m
fef
fef:n
fef:eg
fef:eb
fef:o
fem
femp
femp:b
femp:a
fems
fems:n
fems:ac
fems:dt
fems:c
fems:ds
fsm
fsm:a
fsm:n
fsm:aw
fst
fst:n
fst:uc
fst:ec
fst:c
fst:sc
fst:se
fst:e
fst:ee
fst:ue
va
va:sup
va:t
va:tt
bds:r
bds:i
bds:o
bdw
bdt, bt
bdt+
bdt:n
bdtw
bdts
bdts:n
bdtc
bdr, br
bdr+
bdr:n
bdrw
bdrs:n
bdrc
bdb, bb
bdb+
bdb:n
bdbw
bdbs
bdbs:n
bdbc
bdl, bl
bdl+
bdl:n
bdlw
bdls
bdls:n
bdlc
bdrs
bdtrrs
bdtlrs
bdbrrs
bdblrs
Text
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
xml:lang="${lang}">
<head>
</head>
<body>
${child}
</body>
</html>
<!doctype html>
<head>
<meta charset="${charset}">
</head>
<body>
${child}
</body>
</html>
font-family:cursive;
font-family:fantasy;
font-family:monospace;
font-effect: ;
font-effect:none;
font-effect:engrave;
font-effect:emboss;
font-effect:outline;
font-emphasize: ;
font-emphasize-position: ;
font-emphasize-position:before;
font-emphasize-position:after;
font-emphasize-style: ;
font-emphasize-style:none;
font-emphasize-style:accent;
font-emphasize-style:dot;
font-emphasize-style:circle;
font-emphasize-style:disc;
font-smooth: ;
font-smooth:auto;
font-smooth:never;
font-smooth:always;
font-stretch: ;
font-stretch:normal;
font-stretch:ultra-condensed;
font-stretch:extra-condensed;
font-stretch:condensed;
font-stretch:semi-condensed;
font-stretch:semi-expanded;
font-stretch:expanded;
font-stretch:extra-expanded;
font-stretch:ultra-expanded;
vertical-align: ;
vertical-align:super;
vertical-align:top;
vertical-align:text-top;
Cheat Sheet
va:m
va:bl
va:b
va:tb
va:sub
ta
ta:l
ta:c
ta:r
tal
tal:a
tal:l
tal:c
tal:r
td
td:n
td:u
td:o
td:l
te
te:n
te:ac
te:dt
te:c
te:ds
te:b
te:a
th
th:a
th:f
th:t
th:m
ti
ti:-
tj
tj:a
lis
lis:n
lisp
lisp:i
lisp:o
list
list:n
list:d
list:c
list:s
list:dc
list:dclz
list:lr
list:ur
lisi
lisi:n
pgbb
pgbb:au
pgbb:al
pgbb:l
pgbb:r
pgbi
pgbi:au
pgbi:av
pgba
pgba:au
pgba:al
pgba:l
pgba:r
orp
wid
!
@f
Lists
Print
Others
vertical-align:middle;
vertical-align:baseline;
vertical-align:bottom;
vertical-align:text-bottom;
vertical-align:sub;
text-align: ;
text-align:left;
text-align:center;
text-align:right;
text-align-last: ;
text-align-last:auto;
text-align-last:left;
text-align-last:center;
text-align-last:right;
text-decoration: ;
text-decoration:none;
text-decoration:underline;
text-decoration:overline;
text-decoration:line-through;
text-emphasis: ;
text-emphasis:none;
text-emphasis:accent;
text-emphasis:dot;
text-emphasis:circle;
text-emphasis:disc;
text-emphasis:before;
text-emphasis:after;
text-height: ;
text-height:auto;
text-height:font-size;
text-height:text-size;
text-height:max-size;
text-indent: ;
text-indent:-9999px;
text-justify: ;
text-justify:auto;
Cheat Sheet
tj:iw
tj:ii
tj:ic
tj:d
tj:k
tj:t
to
to+
to:n
tr
tr:n
tt
tt:n
tt:c
tt:u
tt:l
tw
tw:n
tw:no
tw:u
tw:s
tsh
tsh+
tsh:n
lh
lts
whs
whs:n
whs:p
whs:nw
whs:pw
whs:pl
whsc
whsc:n
whsc:k
whsc:l
@f+
@i
@m
bg:ie
cm
op:ie
op:ms
trf
trf:r
trf:sc
trf:scx
trf:scy
trf:skx
trf:sky
trf:t
trf:tx
trf:ty
trs
trsde
trsdu
trsp
trstf
text-justify:inter-word;
text-justify:inter-ideograph;
text-justify:inter-cluster;
text-justify:distribute;
text-justify:kashida;
text-justify:tibetan;
text-outline: ;
text-outline: 0 0 #000 ;
text-outline:none;
text-replace: ;
text-replace:none;
text-transform: ;
text-transform:none;
text-transform:capitalize;
text-transform:uppercase;
text-transform:lowercase;
text-wrap: ;
text-wrap:normal;
text-wrap:none;
text-wrap:unrestricted;
text-wrap:suppress;
text-shadow: hoff voff blur
#000 ;
text-shadow: 0 0 0 #000 ;
text-shadow:none;
line-height: ;
letter-spacing: ;
white-space: ;
white-space:normal;
white-space:pre;
white-space:nowrap;
white-space:pre-wrap;
white-space:pre-line;
white-space-collapse: ;
white-space-collapse:normal;
white-space-collapse:keep-all;
white-space-collapse:loose;
white-space-collapse:break-strict;
Cheat Sheet
XSL
tm
tmatch
tn
tname
call
ap
api
imp
inc
ch
xsl:when
wh
ot
if
par
pare
var
elem
attr
attrs
cp
co
val
each
for
tex
com
msg
fall
num
nam
pres
strip
proc
sort
white-space-collapse:break-all;
word-break: ;
word-break:normal;
word-break:keep-all;
word-break:loose;
word-break:break-strict;
word-break:break-all;
word-spacing: ;
word-wrap: ;
word-wrap:normal;
word-wrap:none;
word-wrap:unrestricted;
word-wrap:suppress;
background: ;
background: #fff url( ) 0 0
no-repeat ;
background:none;
background-color:# fff ;
background-image:url( );
background-image:none;
background-repeat: ;
background-repeat:no-repeat;
background-repeat:repeat-x;
background-repeat:repeat-y;
background-attachment: ;
background-attachment:fixed;
background-attachment:scroll;
background-position: 0 0 ;
background-position-x: ;
background-position-y: ;
background-break: ;
background-break:bounding-box;
background-break:each-box;
background-break:continuous;
background-clip: ;
background-clip:border-box;
<xsl:template match=" " mode=" "> </xsl:template>
Alias of tm
<xsl:template match=" " mode=" "> </xsl:template>
<xsl:template name=" "> </xsl:template>
Alias of tn
<xsl:template name=" "> </xsl:template>
<xsl:call-template name=" " />
<xsl:apply-templates select=" " mode=" " />
<xsl:apply-imports />
<xsl:import href=" " />
<xsl:include href=" " />
<xsl:choose> </xsl:choose>
<xsl:when test=" "> </xsl:when>
Alias of xsl:when
<xsl:when test=" "> </xsl:when>
<xsl:otherwise> </xsl:otherwise>
<xsl:if test=" "> </xsl:if>
<xsl:param name=" "> </xsl:param>
<xsl:param name=" " select=" " />
<xsl:variable name=" "> </xsl:variable>
Cheat Sheet
vare
wp
key
choose+
background-clip:padding-box;
background-clip:content-box;
background-clip:no-clip;
background-origin: ;
background-origin:padding-box;
background-origin:border-box;
background-origin:content-box;
background-size: ;
<xsl:variable name=" " select=" " />
<xsl:with-param name=" " select=" " />
<xsl:key name=" " match=" " use=" " />
<xsl:element name=" "> </xsl:element>

Emmet Cheat Sheet

Încărcat de

Informații document

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Emmet Cheat Sheet

Încărcat de

Drepturi de autor:

Formate disponibile

Cheat Sheet

S-ar putea să vă placă și