Uploaded by Ramendra Saxena

cheatsheet-a5

advertisement
1
Emmet | Cheat Sheet
(2017-03)
Syntax . . . . . . . . 1
Child: > . . . . . . . . . . 1
Sibling: + . . . . . . . . . 1
Climb-up: ^ . . . . . . . . 1
Grouping: () . . . . . . . . 1
Multiplication: * . . . . . . 2
Naming and numbering: $ 2
ID and CLASS attributes . 2
Custom attributes . . . . . 2
Text: {} . . . . . . . . . . . 2
Implicit tag names . . . . 2
HTML . . . . . . . . 3
Form, Input, Button . . . . 4
CSS . . . . . . . . . 7
Visual Formatting . . . . . 7
Margin & Padding . . . . . 9
Box Sizing . . . . . . . . . 9
Font . . . . . . . . . . . . 9
Text . . . . . . . . . . . . 11
Background . . . . . . . 13
Color . . . . . . . . . . . 14
Generated content . . . . 14
Outline . . . . . . . . . . 15
Tables . . . . . . . . . . 15
Border . . . . . . . . . . 15
Lists . . . . . . . . . . . 18
Print . . . . . . . . . . . 18
Others . . . . . . . . . . 18
Animation . . . . . . . . 19
Flex . . . . . . . . . . . . 20
Transform, Transition . . 21
XSL . . . . . . . . .22
HTML DOCTYPES . . 23
http://docs.emmet.io/
Child: >
SYNTAX
nav>ul>li
<nav>
<ul>
<li></li>
</ul>
</nav>
Sibling: +
div+p+bq
<div></div>
<p></p>
<blockquote></blockquote>
Climb-up: ^
div+div>p>span+em^bq
<div></div>
<div>
<p><span></span><em></em></p>
<blockquote></blockquote>
</div>
div+div>p>span+em^^bq
<div></div>
<div>
<p><span></span><em></em></p>
</div>
<blockquote></blockquote>
Grouping: ()
div>(header>ul>li*2>a)+footer>p
<div>
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</header>
<footer>
<p></p>
</footer>
</div>
(div>dl>(dt+dd)*3)+footer>p
<div>
<dl>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
</dl>
</div>
<footer>
<p></p>
</footer>
2
Multiplication: *
ul>li*5
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
Naming and numbering: $
ul>li.sample$*5
<ul>
<li
<li
<li
<li
<li
</ul>
class="sample1"></li>
class="sample2"></li>
class="sample3"></li>
class="sample4"></li>
class="sample5"></li>
h$[title=topic$]{Headline $}*3
<h1 title="topic1">Headline 1</h1>
<h2 title="topic2">Headline 2</h2>
<h3 title="topic3">Headline 3</h3>
ul>li.item$$$*5
<ul>
<li
<li
<li
<li
<li
</ul>
class="item001"></li>
class="item002"></li>
class="item003"></li>
class="item004"></li>
class="item005"></li>
ul>li.item$@-*5
<ul>
<li
<li
<li
<li
<li
</ul>
class="item5"></li>
class="item4"></li>
class="item3"></li>
class="item2"></li>
class="item1"></li>
ul>li.item$@3*5
<ul>
<li
<li
<li
<li
<li
</ul>
class="item3"></li>
class="item4"></li>
class="item5"></li>
class="item6"></li>
class="item7"></li>
ID and CLASS attributes
#header
<div id="header"></div>
.title
<div class="title"></div>
form#search.wide
<form id="search" class="wide"></
form>
p.class1.class2.class3
<p class="class1 class2 class3"></p>
Custom attributes
p[title="Hello world"]
<p title="Hello world"></p>
td[rowspan=2 colspan=3 title]
<td rowspan="2" colspan="3"
title=""></td>
[a=‘value1‘ b="value2"]
<div a="value1" b="value2"></div>
Text: {}
a{Click me}
<a href="">Click me</a>
p>{Click }+a{here}+{ to continue}
<p>Click <a href="">here</a> to
continue</p>
Implicit tag names
.class
<div class="class"></div>
em>.class
<em><span class="class"></span></
em>
ul>.class
<ul>
<li class="class"></li>
</ul>
table>.row>.col
<table>
<tr class="row">
<td class="col"></td>
</tr>
</table>
3
HTML
All unknown abbreviations will be transformed to
tag, e.g. foo → <foo></foo>.
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>
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="ContentType" content="text/
html;charset=windows-1251" />
meta:vp
<meta name="viewport"
content="width=device-width, userscalable=no, initial-scale=1.0,
maximum-scale=1.0, minimumscale=1.0" />
meta:compat
<meta http-equiv="X-UA-Compatible"
content="IE=7" />
bdo:l
style
col
script
link
script:src
<bdo dir="ltr"></bdo>
<col />
<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" />
<style></style>
<script></script>
<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="" />
4
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="" />
Form, Input, Button
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
<input type="hidden" name="" />
input:text, input:t
<input type="text" name="" id=""
/>
input:search
<input type="search" name="" id=""
/>
input:email
<input type="email" name="" id=""
/>
map
input:url
area
input:password, input:p
<map name=""></map>
<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="" />
<input type="url" name="" id="" />
<input type="password" name=""
id="" />
input:datetime
<input type="datetime" name=""
id="" />
input:date
<input type="date" name="" id=""
/>
input:datetime-local
<input type="datetime-local"
name="" id="" />
input:month
<input type="month" name="" id=""
/>
input:week
<input type="week" name="" id=""
/>
input:time
<input type="time" name="" id=""
/>
5
input:tel
audio
input:number
html:xml
input:color
keygen
<input type="tel" name="" id="" />
<input type="number" name="" id=""
/>
<input type="color" name="" id=""
/>
input:checkbox, input:c
<input type="checkbox" name=""
id="" />
input:radio, input:r
<input type="radio" name="" id=""
/>
input:range
<input type="range" name="" id=""
/>
input:file, input:f
<input type="file" name="" id="" />
<audio src=""></audio>
<html xmlns="http://www.
w3.org/1999/xhtml"></html>
<keygen />
command
<command />
button:submit, button:s, btn:s
<button type="submit"></button>
button:reset, button:r, btn:r
<button type="reset"></button>
button:disabled, button:d, btn:d
<button disabled="disabled"></
button>
fieldset:disabled,
fieldset:d, fset:d, fst:d
<fieldset disabled="disabled"></
fieldset>
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="" />
bq
<blockquote></blockquote>
fig
<figure></figure>
figc
<figcaption></figcaption>
isindex
pic
input:reset
ifr
<isindex />
<input type="reset" value="" />
select
<select name="" id=""></select>
select:disabled, select:d
<select name="" id=""
disabled="disabled"></select>
<picture></picture>
<iframe src="" frameborder="0"></
iframe>
emb
<embed src="" type="" />
obj
<object data="" type=""></object>
option, opt
cap
textarea
colg
<option value=""></option>
<textarea name="" id="" cols="30"
rows="10"></textarea>
marquee
<marquee behavior=""
direction=""></marquee>
menu:context, menu:c
<menu type="context"></menu>
menu:toolbar, menu:t
<menu type="toolbar"></menu>
video
<video src=""></video>
<caption></caption>
<colgroup></colgroup>
fst, fset
<fieldset></fieldset>
btn
<button></button>
optg
<optgroup></optgroup>
tarea
<textarea name="" id="" cols="30"
rows="10"></textarea>
6
leg
<legend></legend>
sect
<section></section>
art
<article></article>
hdr
<header></header>
ftr
<footer></footer>
adr
<address></address>
dlg
<dialog></dialog>
str
<strong></strong>
prog
<progress></progress>
mn
<main></main>
tem
<template></template>
datag
<datagrid></datagrid>
datal
<datalist></datalist>
kg
<keygen />
out
<output></output>
det
<details></details>
cmd
<command />
ri:dpr, ri:d
<img srcset="" src="" alt="" />
ri:viewport, ri:v
<img sizes="" srcset="" src=""
alt="" />
ri:art, ri:a
<picture>
<source media="(min-width: )"
srcset="" />
<img src="" alt="" />
</picture>
ri:type, ri:t
<picture>
<source srcset="" type="image/"
/>
<img src="" alt="" />
</picture>
ol+
<ol>
<li></li>
</ol>
ul+
<ul>
<li></li>
</ul>
dl+
<dl>
<dt></dt>
<dd></dd>
</dl>
map+
<map name="">
<area shape="" coords=""
href="" alt="" />
</map>
table+
<table>
<tr>
<td></td>
</tr>
</table>
colgroup+, colg+
<colgroup>
<col />
</colgroup>
tr+
<tr>
<td></td>
</tr>
select+
<select name="" id="">
<option value=""></option>
</select>
optgroup+, optg+
<optgroup>
<option value=""></option>
</optgroup>
pic+
<picture>
<source srcset="" />
<img src="" alt="" />
</picture>
7
CSS
fl:r
float:right;
CSS module uses fuzzy search to find unknown abbreviations, e.g. ov:h == ov-h == ovh == oh.
cl
If abbreviation wasn’t found, it is transformed into
property name: foo-bar → foo-bar: |;
cl:n
You can prefix abbreviations with hyphen to produce
vendor-prefixed properties: -foo
Visual Formatting
clear:both;
clear:none;
cl:l
clear:left;
pos
cl:r
pos:s
cl:b
position:relative;
position:static;
pos:a
position:absolute;
pos:r
position:relative;
pos:f
position:fixed;
t
top:;
clear:right;
clear:both;
d
display:block;
d:n
display:none;
d:b
display:block;
d:f
display:flex;
t:a
d:if
r
d:i
top:auto;
right:;
display:inline-flex;
display:inline;
r:a
d:ib
b
d:li
right:auto;
bottom:;
display:inline-block;
display:list-item;
b:a
d:ri
l
d:cp
bottom:auto;
left:;
display:run-in;
display:compact;
l:a
d:tb
z
d:itb
left:auto;
z-index:;
display:table;
display:inline-table;
z:a
d:tbcp
fl
d:tbcl
z-index:auto;
float:left;
display:table-caption;
display:table-column;
fl:n
d:tbclg
fl:l
d:tbhg
float:none;
float:left;
display:table-column-group;
display:table-header-group;
8
d:tbfg
ovx:a
d:tbr
ovy
d:tbrg
ovy:v
d:tbc
ovy:h
d:rb
ovy:s
d:rbb
ovy:a
d:rbbg
ovs
d:rbt
ovs:a
d:rbtg
ovs:s
v
ovs:p
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:hidden;
overflow-x:auto;
overflow-y:hidden;
overflow-y:visible;
overflow-y:hidden;
overflow-y:scroll;
overflow-y:auto;
overflow-style:scrollbar;
overflow-style:auto;
overflow-style:scrollbar;
overflow-style:panner;
v:v
ovs:m
v:h
ovs:mq
v:c
zoo, zm
ov
cp
visibility:visible;
visibility:hidden;
visibility:collapse;
overflow:hidden;
overflow-style:move;
overflow-style:marquee;
zoom:1;
clip:;
ov:v
cp:a
ov:h
cp:r
overflow:visible;
overflow:hidden;
ov:s
overflow:scroll;
ov:a
overflow:auto;
clip:auto;
clip:rect(top right bottom left);
rsz
resize:;
rsz:n
resize:none;
ovx
rsz:b
ovx:v
rsz:h
overflow-x:hidden;
overflow-x:visible;
ovx:h
overflow-x:hidden;
ovx:s
overflow-x:scroll;
resize:both;
resize:horizontal;
rsz:v
resize:vertical;
cur
cursor:${pointer};
9
cur:a
cursor:auto;
pl
cur:d
cursor:default;
padding-left:;
Box Sizing
cur:c
bxz
cur:ha
bxz:cb
cursor:crosshair;
cursor:hand;
cur:he
cursor:help;
cur:m
cursor:move;
cur:p
cursor:pointer;
box-sizing:border-box;
box-sizing:content-box;
bxz:bb
box-sizing:border-box;
bxsh
box-shadow:inset hoff voff blur
color;
bxsh:r
box-shadow:inset hoff voff blur
spread rgb(0, 0, 0);
cur:t
cursor:text;
Margin & Padding
m
margin:;
m:a
mt
w:a
pt
pr
pb
width:;
width:auto;
margin-top:auto;
h
margin-right:;
h:a
height:;
height:auto;
margin-right:auto;
maw
margin-bottom:;
maw:n
max-width:;
max-width:none;
margin-bottom:auto;
mah
margin-left:;
mah:n
ml:a
p
box-shadow:none;
margin-top:;
mb:a
ml
bxsh:n
w
mr:a
mb
box-shadow:inset h v blur spread
rgba(0, 0, 0, .5);
margin:auto;
mt:a
mr
bxsh:ra
max-height:;
max-height:none;
margin-left:auto;
miw
padding:;
mih
min-width:;
min-height:;
padding-top:;
padding-right:;
padding-bottom:;
Font
f
font:;
10
f+
fw
font:1em Arial,sans-serif;
font-weight:;
fw:n
font-weight:normal;
ff:t
font-family: „Times New Roman",
Times, Baskerville, Georgia, serif;
ff:v
font-family: Verdana, Geneva,
sans-serif;
fw:b
fef
fw:br
fef:n
fw:lr
fef:eg
fs, fs:i
fef:eb
fs:n
fef:o
fs:o
fem
fv
femp
font-weight:bold;
font-weight:bolder;
font-weight:lighter;
font-style:italic;
font-style:normal;
font-style:oblique;
font-variant:;
font-effect:;
font-effect:none;
font-effect:engrave;
font-effect:emboss;
font-effect:outline;
font-emphasize:;
font-emphasize-position:;
fv:n
femp:b
fv:sc
femp:a
fz
fems
font-variant:normal;
font-variant:small-caps;
font-size:;
font-emphasize-position:before;
font-emphasize-position:after;
font-emphasize-style:;
fza
fems:n
fza:n
fems:ac
ff
fems:dt
font-size-adjust:;
font-size-adjust:none;
font-family:;
font-emphasize-style:none;
font-emphasize-style:accent;
font-emphasize-style:dot;
ff:s
fems:c
ff:ss
fems:ds
ff:c
fsm
ff:f
fsm:a
ff:m
fsm:n
ff:a
fsm:aw
font-family:serif;
font-family:sans-serif;
font-family:cursive;
font-family:fantasy;
font-family:monospace;
font-family: Arial, „Helvetica
Neue", Helvetica, sans-serif;
font-emphasize-style:circle;
font-emphasize-style:disc;
font-smooth:;
font-smooth:auto;
font-smooth:never;
font-smooth:always;
11
fst
ta:r
fst:n
ta:j
fst:uc
ta-lst
fst:ec
tal:a
fst:c
tal:l
fst:sc
tal:c
fst:se
tal:r
fst:e
td, td:n
fst:ee
td:u
fst:ue
td:o
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;
Text
va
vertical-align:top;
va:sup
vertical-align:super;
va:t
vertical-align:top;
va:tt
vertical-align:text-top;
text-align:right;
text-align:justify;
text-align-last:;
text-align-last:auto;
text-align-last:left;
text-align-last:center;
text-align-last:right;
text-decoration:none;
text-decoration:underline;
text-decoration:overline;
td:l
text-decoration:line-through;
te
text-emphasis:;
te:n
text-emphasis:none;
te:ac
text-emphasis:accent;
te:dt
text-emphasis:dot;
va:m
te:c
va:bl
te:ds
vertical-align:middle;
vertical-align:baseline;
va:b
vertical-align:bottom;
va:tb
vertical-align:text-bottom;
text-emphasis:circle;
text-emphasis:disc;
te:b
text-emphasis:before;
te:a
text-emphasis:after;
va:sub
th
ta, ta:l
th:a
vertical-align:sub;
text-align:left;
ta:c
text-align:center;
text-height:;
text-height:auto;
th:f
text-height:font-size;
12
th:t
tw
th:m
tw:n
ti
tw:no
text-height:text-size;
text-height:max-size;
text-indent:;
text-wrap:;
text-wrap:normal;
text-wrap:none;
ti:-
tw:u
tj
tw:s
text-indent:-9999px;
text-justify:;
text-wrap:unrestricted;
text-wrap:suppress;
tj:a
tsh
tj:iw
tsh:r
tj:ii
tsh:ra
text-justify:auto;
text-justify:inter-word;
text-justify:inter-ideograph;
tj:ic
text-justify:inter-cluster;
tj:d
text-justify:distribute;
tj:k
text-justify:kashida;
tj:t
to
text-shadow:h v blur rgba(0, 0, 0,
.5);
tsh+
text-shadow:0 0 0 #000;
tsh:n
text-shadow:none;
lh
line-height:;
lts
text-outline:;
lts-n
text-outline:0 0 #000;
to:n
letter-spacing:;
letter-spacing:normal;
whs
white-space:;
text-outline:none;
whs:n
text-replace:;
whs:p
tr:n
tt
text-shadow:h v blur rgb(0, 0, 0);
text-justify:tibetan;
to+
tr
text-shadow:hoff voff blur #000;
white-space:normal;
white-space:pre;
text-replace:none;
whs:nw
text-transform:uppercase;
whs:pw
tt:n
text-transform:none;
tt:c
text-transform:capitalize;
tt:u
text-transform:uppercase;
tt:l
text-transform:lowercase;
white-space:nowrap;
white-space:pre-wrap;
whs:pl
white-space:pre-line;
whsc
white-space-collapse:;
whsc:n
white-space-collapse:normal;
whsc:k
white-space-collapse:keep-all;
13
whsc:l
white-space-collapse:loose;
whsc:bs
white-space-collapse:break-strict;
whsc:ba
white-space-collapse:break-all;
Background
bg
background:#000;
bg+
background:#fff url() 0 0
no-repeat;
wob
bg:n
wob:n
bgc
wob:k
bgc:t
wob:ba
bgi
wos
bgi:n
wow
bgr
wow:nm
bgr:n
wow:n
bgr:x
wow:u
bgr:y
wow:s
bgr:sp
wow:b
bgr:rd
word-break:;
word-break:normal;
word-break:keep-all;
word-break:break-all;
word-spacing:;
word-wrap:;
word-wrap:normal;
word-wrap:none;
word-wrap:unrestricted;
word-wrap:suppress;
word-wrap:break-word;
background:none;
background-color:#fff;
background-color:transparent;
background-image:url();
background-image:none;
background-repeat:;
background-repeat:no-repeat;
background-repeat:repeat-x;
background-repeat:repeat-y;
background-repeat:space;
background-repeat:round;
bga
background-attachment:;
bga:f
background-attachment:fixed;
bga:s
background-attachment:scroll;
bgp
background-position:0 0;
bgpx
background-position-x:;
bgpy
background-position-y:;
bgbk
background-break:;
bgbk:bb
background-break:bounding-box;
14
bgbk:eb
background-break:each-box;
bgbk:c
background-break:continuous;
bgcp
background-clip:padding-box;
bgcp:bb
background-clip:border-box;
bgcp:pb
Color
c
color:#000;
c:r
color:rgb(0, 0, 0);
c:ra
color:rgba(0, 0, 0, .5);
op
background-clip:padding-box;
Generated content
bgcp:cb
background-clip:content-box;
bgcp:nc
background-clip:no-clip;
bgo
background-origin:;
bgo:pb
background-origin:padding-box;
bgo:bb
background-origin:border-box;
bgo:cb
background-origin:content-box;
bgsz
background-size:;
bgsz:a
background-size:auto;
bgsz:ct
background-size:contain;
bgsz:cv
background-size:cover;
opacity:;
cnt
content:'';
cnt:n, ct:n
content:normal;
cnt:oq, ct:oq
content:open-quote;
cnt:noq, ct:noq
content:no-open-quote;
cnt:cq, ct:cq
content:close-quote;
cnt:ncq, ct:ncq
content:no-close-quote;
cnt:a, ct:a
content:attr();
cnt:c, ct:c
content:counter();
cnt:cs, ct:cs
content:counters();
ct
q
content:;
quotes:;
q:n
quotes:none;
q:ru
quotes:‘\00AB‘ ‚\00BB‘ ‚\201E‘
‚\201C‘;
q:en
quotes:‘\201C‘ ‚\201D‘ ‚\2018‘
‚\2019‘;
coi
counter-increment:;
cor
counter-reset:;
15
Outline
ol
outline:;
Tables
tbl
table-layout:;
ol:n
tbl:a
olo
tbl:f
olw
cps
olw:tn
cps:t
olw:m
cps:b
olw:tc
ec
ols
ec:s
ols:n
ec:h
outline:none;
outline-offset:;
outline-width:;
outline-width:thin;
outline-width:medium;
outline-width:thick;
outline-style:;
outline-style:none;
ols:dt
outline-style:dotted;
table-layout:auto;
table-layout:fixed;
caption-side:;
caption-side:top;
caption-side:bottom;
empty-cells:;
empty-cells:show;
empty-cells:hide;
Border
ols:ds
bd
ols:s
bd+
ols:db
bd:n
ols:g
bdbk
ols:r
bdbk:c
ols:i
bdcl
ols:o
bdcl:c
olc
bdcl:s
olc:i
bdc
outline-style:dashed;
outline-style:solid;
outline-style:double;
outline-style:groove;
outline-style:ridge;
outline-style:inset;
outline-style:outset;
outline-color:#000;
outline-color:invert;
border:;
border:1px solid #000;
border:none;
border-break:close;
border-break:close;
border-collapse:;
border-collapse:collapse;
border-collapse:separate;
border-color:#000;
bdc:t
border-color:transparent;
bdi
border-image:url();
bdi:n
border-image:none;
16
bdti
bdbli:c
bdti:n
bdf
bdri
bdf:c
bdri:n
bdf:r
bdbi
bdf:sc
bdbi:n
bdf:st
bdli
bdf:ow
bdli:n
bdf:of
bdci
bdf:sp
bdci:n
bdlen
bdci:c
bdlen:a
bdtli
bdsp
bdtli:n
bds
bdtli:c
bds:n
bdtri
bds:h
bdtri:n
bds:dt
bdtri:c
bds:ds
bdbri
bds:s
bdbri:n
bds:db
bdbri:c
bds:dtds
bdbli
bds:dtdtds
bdbli:n
bds:w
border-top-image:url();
border-top-image:none;
border-right-image:url();
border-right-image:none;
border-bottom-image:url();
border-bottom-image:none;
border-left-image:url();
border-left-image:none;
border-corner-image:url();
border-corner-image:none;
border-corner-image:continue;
border-top-left-image:url();
border-top-left-image:none;
border-top-left-image:continue;
border-top-right-image:url();
border-top-right-image:none;
border-top-right-image:continue;
border-bottom-right-image:url();
border-bottom-right-image:none;
border-bottom-right-image:continue;
border-bottom-left-image:url();
border-bottom-left-image:none;
border-bottom-left-image:continue;
border-fit:repeat;
border-fit:clip;
border-fit:repeat;
border-fit:scale;
border-fit:stretch;
border-fit:overwrite;
border-fit:overflow;
border-fit:space;
border-length:;
border-length:auto;
border-spacing:;
border-style:;
border-style:none;
border-style:hidden;
border-style:dotted;
border-style:dashed;
border-style:solid;
border-style:double;
border-style:dot-dash;
border-style:dot-dot-dash;
border-style:wave;
17
bds:g
bdb+
bds:r
bdb:n
bds:i
bdbw
bds:o
bdbs
bdw
bdbs:n
bdt, bt
bdbc
bdt+
bdbc:t
bdt:n
bdl, bl
bdtw
bdl+
bdts
bdl:n
bdts:n
bdlw
bdtc
bdls
bdtc:t
bdls:n
bdr, br
bdlc
bdr+
bdlc:t
bdr:n
bdrs
bdrw
bdtrrs
bdrst
bdtlrs
bdrst:n
bdbrrs
bdrc
bdblrs
border-style:groove;
border-style:ridge;
border-style:inset;
border-style:outset;
border-width:;
border-top:;
border-top:1px solid #000;
border-top:none;
border-top-width:;
border-top-style:;
border-top-style:none;
border-top-color:#000;
border-top-color:transparent;
border-right:;
border-right:1px solid #000;
border-right:none;
border-right-width:;
border-right-style:;
border-right-style:none;
border-right-color:#000;
bdrc:t
border-right-color:transparent;
bdb, bb
border-bottom:;
border-bottom:1px solid #000;
border-bottom:none;
border-bottom-width:;
border-bottom-style:;
border-bottom-style:none;
border-bottom-color:#000;
border-bottom-color:transparent;
border-left:;
border-left:1px solid #000;
border-left:none;
border-left-width:;
border-left-style:;
border-left-style:none;
border-left-color:#000;
border-left-color:transparent;
border-radius:;
border-top-right-radius:;
border-top-left-radius:;
border-bottom-right-radius:;
border-bottom-left-radius:;
18
Lists
lis
list-style:;
lis:n
list-style:none;
lisp
list-style-position:;
lisp:i
list-style-position:inside;
lisp:o
list-style-position:outside;
list
list-style-type:;
list:n
list-style-type:none;
list:d
list-style-type:disc;
list:c
list-style-type:circle;
list:s
list-style-type:square;
pgbb:r
page-break-before:right;
pgbi
page-break-inside:;
pgbi:au
page-break-inside:auto;
pgbi:av
page-break-inside:avoid;
pgba
page-break-after:;
pgba:au
page-break-after:auto;
pgba:al
page-break-after:always;
pgba:l
page-break-after:left;
pgba:r
page-break-after:right;
orp
orphans:;
wid
widows:;
list:dc
list-style-type:decimal;
list:dclz
list-style-type:decimal-leadingzero;
list:lr
list-style-type:lower-roman;
list:ur
list-style-type:upper-roman;
lisi
list-style-image:;
lisi:n
list-style-image:none;
Print
pgbb
page-break-before:;
pgbb:au
page-break-before:auto;
pgbb:al
page-break-before:always;
pgbb:l
page-break-before:left;
Others
!
@f
!important
@font-face {
font-family:;
src:url(|);
}
@f+
@font-face {
font-family: ‚FontName‘;
src: url(‚FileName.eot‘);
src: url(‚FileName.eot?#iefix‘)
format(‚embedded-opentype‘),
url(‚FileName.woff‘)
format(‚woff‘),
url(‚FileName.ttf‘)
format(‚truetype‘),
url(‚FileName.
svg#FontName‘) format(‚svg‘);
font-style: normal;
font-weight: normal;
}
19
@i, @import
@import url();
@kf
@-webkit-keyframes identifier {
from { }
to { }
}
@-o-keyframes identifier {
from { }
to { }
}
@-moz-keyframes identifier {
from { }
to { }
}
@keyframes identifier {
from { }
to { }
}
Animation
anim
animation:;
anim-
animation:name duration timingfunction delay iteration-count
direction fill-mode;
animdel
animation-delay:time;
animdir
animation-direction:normal;
animdir:a
animation-direction:alternate;
animdir:ar
animation-direction:alternatereverse;
@m, @media
animdir:n
ac
animdir:r
@media screen { }
align-content:;
animation-direction:normal;
animation-direction:reverse;
ac:c
animdur
ac:fe
animfm
ac:fs
animfm:b
ac:s
animfm:bt, animfm:bh
ac:sa
animfm:f
ac:sb
animic
ai
animic:i
align-content:center;
align-content:flex-end;
align-content:flex-start;
align-content:stretch;
align-content:space-around;
align-content:space-between;
align-items:;
animation-duration:0s;
animation-fill-mode:both;
animation-fill-mode:backwards;
animation-fill-mode:both;
animation-fill-mode:forwards;
animation-iteration-count:1;
animation-iteration-count:infinite;
ai:b
animn
ai:c
animps
ai:fe
animps:p
ai:fs
animps:r
ai:s
animtf
align-items:baseline;
align-items:center;
align-items:flex-end;
align-items:flex-start;
align-items:stretch;
animation-name:none;
animation-play-state:running;
animation-play-state:paused;
animation-play-state:running;
animation-timing-function:linear;
20
animtf:cb
animation-timing-function:cubicbezier(0.1, 0.7, 1.0, 0.1);
colmf
column-fill:;
animtf:e
colmg
animtf:ei
colmr
animtf:eio
colmrc
column-gap:;
animation-timing-function:ease;
column-rule:;
animation-timing-function:ease-in;
animation-timing-function:ease-inout;
column-rule-color:;
colmrs
column-rule-style:;
animation-timing-function:ease-out; colmrw
column-rule-width:;
animtf:l
animation-timing-function:linear;
colms
column-span:;
ap
appearance:${none};
colmw
column-width:;
as
align-self:;
d:ib+
display: inline-block;
as:a
*display: inline;
align-self:auto;
*zoom: 1;
animtf:eo
as:b
align-self:baseline;
as:c
align-self:center;
as:fe
align-self:flex-end;
as:fs
align-self:flex-start;
Flex
fx
flex:;
fxb
flex-basis:;
fxd
flex-direction:;
as:s
fxd:c
bfv
fxd:cr
align-self:stretch;
backface-visibility:;
bfv:h
backface-visibility:hidden;
bfv:v
backface-visibility:visible;
bg:ie
filter:progid:DXImageTransform.
Microsoft.AlphaImageLoader(src=‘x.
png‘,sizingMethod=‘crop‘);
cm
/* ${child} */
colm
columns:;
colmc
column-count:;
flex-direction:column;
flex-direction:column-reverse;
fxd:r
flex-direction:row;
fxd:rr
flex-direction:row-reverse;
fxf
flex-flow:;
fxg
flex-grow:;
fxsh
flex-shrink:;
fxw
flex-wrap: ;
21
fxw:n
flex-wrap:nowrap;
fxw:w
flex-wrap:wrap;
fxw:wr
flex-wrap:wrap-reverse;
jc
justify-content:;
jc:c
justify-content:center;
jc:fe
justify-content:flex-end;
jc:fs
justify-content:flex-start;
jc:sa
justify-content:space-around;
jc:sb
justify-content:space-between;
mar
max-resolution:res;
mir
min-resolution:res;
op+
opacity: ;
filter: alpha(opacity=);
op:ie
filter:progid:DXImageTransform.
Microsoft.Alpha(Opacity=100);
Transform, Transition
trf
transform:;
trf:r
transform: rotate(angle);
trf:rx
transform: rotateX(angle);
trf:ry
transform: rotateY(angle);
trf:rz
transform: rotateZ(angle);
trf:sc
transform: scale(x, y);
trf:sc3
transform: scale3d(x, y, z);
trf:scx
transform: scaleX(x);
trf:scy
transform: scaleY(y);
trf:scz
transform: scaleZ(z);
trf:skx
transform: skewX(angle);
trf:sky
transform: skewY(angle);
trf:t
transform: translate(x, y);
op:ms
trf:t3
ord
trf:tx
ori
trf:ty
ori:l
trf:tz
ori:p
trfo
tov
trfs
tov:c
trs
tov:e
trsde
-ms-filter:‘progid:DXImageTransform.
Microsoft.Alpha(Opacity=100)‘;
order:;
orientation:;
orientation:landscape;
orientation:portrait;
text-overflow:${ellipsis};
text-overflow:clip;
text-overflow:ellipsis;
transform: translate3d(tx, ty,
tz);
transform: translateX(x);
transform: translateY(y);
transform: translateZ(z);
transform-origin:;
transform-style:preserve-3d;
transition:prop time;
transition-delay:time;
22
trsdu
transition-duration:time;
trsp
transition-property:prop;
trstf
us
XSL
tmatch, tm
<xsl:template match="" mode=""></
xsl:template>
transition-timing-function:tfunc;
tname, tn
<xsl:template name=""></
xsl:template>
user-select:${none};
call
<xsl:call-template name="" />
wfsm
-webkit-fontsmoothing:${antialiased};
ap
wfsm:a
<xsl:apply-templates select=""
mode="" />
-webkit-font-smoothing:antialiased; api
wfsm:n
-webkit-font-smoothing:none;
wfsm:s, wfsm:sa
-webkit-font-smoothing:subpixelantialiased;
wm
writing-mode:lr-tb;
wm:btl
writing-mode:bt-lr;
wm:btr
writing-mode:bt-rl;
wm:lrb
writing-mode:lr-bt;
wm:lrt
writing-mode:lr-tb;
wm:rlb
writing-mode:rl-bt;
imp
inc
ch
writing-mode:rl-tb;
writing-mode:tb-lr;
wm:tbr
writing-mode:tb-rl;
<xsl:import href="" />
<xsl:include href="" />
<xsl:choose></xsl:choose>
xsl:when, wh
<xsl:when test=""></xsl:when>
ot
<xsl:otherwise></xsl:otherwise>
if
<xsl:if test=""></xsl:if>
par
<xsl:param name=""></xsl:param>
pare
<xsl:param name="" select="" />
var
<xsl:variable name=""></
xsl:variable>
wm:rlt
wm:tbl
<xsl:apply-imports />
vare
<xsl:variable name="" select="" />
wp
key
<xsl:with-param name="" select="" />
<xsl:key name="" match="" use="" />
elem
<xsl:element name=""></xsl:element>
attr
<xsl:attribute name=""></
xsl:attribute>
attrs
<xsl:attribute-set name=""></
xsl:attribute-set>
cp
<xsl:copy select="" />
23
HTML DOCTYPES
co
<xsl:copy-of select="" />
val
<xsl:value-of select="" />
each, for
<xsl:for-each select=""></
xsl:for-each>
tex
com
<xsl:text></xsl:text>
<xsl:comment></xsl:comment>
msg
<xsl:message terminate="no"></
xsl:message>
!, html:5
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
</body>
</html>
doc
<xsl:number value="" />
<html>
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<namespace-alias stylesheet-prefix=""
result-prefix="" />
</body>
</html>
fall
<xsl:fallback></xsl:fallback>
num
nam
pres
<xsl:preserve-space elements="" />
strip
<xsl:strip-space elements="" />
proc
<xsl:processinginstruction name=""></
xsl:processing-instruction>
sort
<xsl:sort select="" order="" />
choose+
<xsl:choose>
<xsl:when test=""></xsl:when>
<xsl:otherwise></xsl:otherwise>
</xsl:choose>
xsl
|}
<?xml version="1.0"
encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/
XSL/Transform"></xsl:stylesheet>
!!!
<?xml version="1.0"
encoding="UTF-8"?>
doc4
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html;charset=UTF-8"
/>
<title>Document</title>
</head>
<body>
</body>
</html>
html:4t
<!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>
24
html:4s
<!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
<!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
html:xxs
<!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>
!!!
<!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
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Strict//EN" "http://www.
XHTML 1.0 Strict//EN" "http://www.
w3.org/TR/xhtml1/DTD/xhtml1-strict.
w3.org/TR/xhtml1/DTD/xhtml1-strict.
dtd">
dtd">
<html xmlns="http://www.
!!!xxs
w3.org/1999/xhtml" xml:lang="en">
<!DOCTYPE html PUBLIC "-//W3C//DTD
<head>
XHTML 1.1//EN" "http://www.w3.org/
<meta http-equiv="Content-Type"
TR/xhtml11/DTD/xhtml11.dtd">
content="text/html;charset=UTF-8"
/>
<title>Document</title>
</head>
<body>
</body>
</html>
http://docs.emmet.io/
Download