You are on page 1of 31

Child: >

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

HTML
All unknown
abbreviations
will be
transformed to
tag,
e.g. foo <foo></
oo>.

f
!

Alias of html:5
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF8" />
<title>Document</title>
</head>
<body> </body>
</html>
a
<a

href=""></a>
a:link
<a href="http://"></a>
a:mail
1

<a href="mailto:"></a>
abbr
<abbr title=""></abbr>
acronym, acr

<link rel="shortcut icon"


type="image/x-icon"
href="favicon.ico" />
link:touch

<acronym title=""></acronym>

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

base

link:rss

<base href="" />


basefont

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

<basefont />

link:atom

br

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

<br />
frame
<frame />

link:import, link:im

hr

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

<hr />

meta

bdo

<meta />

<bdo dir=""></bdo>

meta:utf

bdo:r

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

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

meta:win

col

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

<col />

meta:vp

link

<meta name="viewport"
content="width=device-width, userscalable=no, initial-scale=1.0,
maximum-scale=1.0, minimumscale=1.0" />

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

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


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

meta:compat
<meta http-equiv="X-UA-Compatible"
content="IE=7" />
style
<style></style>
script
2

<script></script>

iframe

script:src

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

<script src=""></script>
img
<img src="" alt="" />
img:srcset, img:s
<img srcset="" src="" alt="" />
img:sizes, img:z
<img sizes="" srcset="" src=""
alt="" />

embed
<embed src="" type="" />
object
<object data="" type=""></object>
param
<param name="" value="" />
map

picture

<map name=""></map>

<picture></picture>

area

source, src

<area shape="" coords="" href=""


alt="" />

<source />
source:src, src:sc
<source src="" type="" />
source:srcset, src:s
<source srcset="" />
source:media, src:m
<source media="(min-width: )"
srcset="" />

area:d
<area shape="default" href=""
alt="" />
area:c
<area shape="circle" coords=""
href="" alt="" />
area:r

source:type, src:t

<area shape="rect" coords="" href=""


alt="" />

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

area:p

source:sizes, src:z

<area shape="poly" coords=""


href="" alt="" />

<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/" />

form
<form action=""></form>
form:get
<form action=""
method="get"></form>
form:post
<form action=""
method="post"></form>
label
3

<label for=""></label>

Alias of inp[type=datetime-local]

input

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

<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

input:month
Alias of inp[type=month]
<input type="month" name=""
id="" />
input:week
Alias of inp[type=week]

Alias of inp

<input type="week" name=""


id="" />

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

input:time

input:search

Alias of inp[type=time]

Alias of inp[type=search]

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

<input type="search" name=""


id="" />

input:tel

input:email
Alias of inp[type=email]

Alias of inp[type=tel]
<input type="tel" name="" id="" />
input:number

<input type="email" name=""


id="" />

Alias of inp[type=number]

input:url

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


/>

Alias of inp[type=url]
<input type="url" name="" id="" />
input:password, input:p
Alias of inp[type=password]

input:color
Alias of inp[type=color]
<input type="color" name="" id="" />
input:checkbox, input:c

<input type="password" name=""


id="" />

Alias of inp[type=checkbox]

input:datetime

<input type="checkbox" name=""


id="" />

Alias of inp[type=datetime]

input:radio, input:r

<input type="datetime" name=""


id="" />

Alias of inp[type=radio]

input:date

<input type="radio" name=""


id="" />

Alias of inp[type=date]
<input type="date" name="" id="" />

input:range
Alias of inp[type=range]

input:datetime-local
4

<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>

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>

textarea

fieldset:disabled, fieldset:d,
fset:d, fst:d

<textarea name="" id="" cols="30"


rows="10"></textarea>

Alias of fieldset[disabled.]

marquee

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

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

bq

menu:context, menu:c
Alias of menu[type=context]>
<menu type="context"></menu>
menu:toolbar, menu:t

Alias of blockquote
<blockquote></blockquote>
fig
Alias of figure
5

<figure></figure>

tarea

figc

Alias of textarea

Alias of figcaption

<textarea name="" id="" cols="30"


rows="10"></textarea>

<figcaption></figcaption>
pic
Alias of picture
<picture></picture>
ifr
Alias of iframe
<iframe src=""
frameborder="0"></iframe>

leg
Alias of legend
<legend></legend>
sect
Alias of section
<section></section>
art

emb

Alias of article

Alias of embed

<article></article>

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

hdr

obj

Alias of header

Alias of object

<header></header>

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

ftr

cap

Alias of footer

Alias of caption

<footer></footer>

<caption></caption>

adr

colg

Alias of address

Alias of colgroup

<address></address>

<colgroup></colgroup>

dlg

fst, fset

Alias of dialog

Alias of fieldset

<dialog></dialog>

<fieldset></fieldset>

str

btn

Alias of strong

Alias of button

<strong></strong>

<button></button>

prog

optg

Alias of progress

Alias of optgroup

<progress></progress>

<optgroup></optgroup>

mn

Alias of main

doc4

<main></main>

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

tem
Alias of template
<template></template>

<datalist></datalist>

<html>
<head>
<meta httpequiv="Content-Type"
content="text/html;chars
et=UTF-8" />
<title>Document</title>
</head>
<body> </body>
</html>

kg

ri:dpr, ri:d

Alias of keygen

Alias of img:s

<keygen />

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

out

ri:viewport, ri:v

Alias of output

Alias of img:z

<output></output>

<img sizes="" srcset="" src=""


alt="" />

datag
Alias of datagrid
<datagrid></datagrid>
datal
Alias of datalist

det
Alias of details
<details></details>

ri:art, ri:a
Alias of pic>src:m+img

Alias of command

<picture> <source media="(minwidth: )" srcset="" /> <img src=""


alt="" /> </picture>

<command />

ri:type, ri:t

doc

Alias of pic>src:t+img

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

<picture> <source srcset=""


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

<html>
<head>
<meta charset="UTF8" />
<title>Document</title>
</head>
<body> </body>
</html>

html:4t

cmd

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">
7

<head>
<meta httpequiv="Content-Type"
content="text/html;chars
et=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 httpequiv="Content-Type"
content="text/html;chars
et=UTF-8" />
<title>Document</title>
</head>
<body> </body>
</html>
html:xt
Alias of !!!
xt+doc4[xmlns=http://www.w3.org/19
99/xhtml xml:lang=${lang}]
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xht
ml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml
" xml:lang="en">
<head>
<meta httpequiv="Content-Type"
content="text/html;chars
et=UTF-8" />
<title>Document</title>
</head>
<body> </body>
</html>
html:xs

Alias of !!!
xs+doc4[xmlns=http://www.w3.org/19
99/xhtml xml:lang=${lang}]
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xht
ml1-strict.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml
" xml:lang="en">
<head>
<meta httpequiv="Content-Type"
content="text/html;chars
et=UTF-8" />
<title>Document</title>
</head>
<body> </body>
</html>
html:xxs
Alias of !!!
xxs+doc4[xmlns=http://www.w3.org/1
999/xhtml xml:lang=${lang}]
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/x
html11.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml
" xml:lang="en">
<head>
<meta httpequiv="Content-Type"
content="text/html;chars
et=UTF-8" />
<title>Document</title>
</head>
<body> </body>
</html>
html:5
Alias of !!!+doc[lang=${lang}]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF8" />
<title>Document</title>
</head>
8

<body>
</body>
</html>

<col />
</colgroup>

ol+

tr+

Alias of ol>li

Alias of tr>td

<ol>

<tr>
<li></li>

</ol>

<td></td>
</tr>
select+

ul+

Alias of select>option

Alias of ul>li
<ul>
<li></li>

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


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

</ul>

optgroup+, optg+

dl+

Alias of optgroup>option

Alias of dl>dt+dd

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

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

Alias of picture>source:srcset+img

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

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

table+
Alias of table>tr>td

<!DOCTYPE html>
!!!4t

<table>
<tr>
<td></td>
</tr>
</table>
colgroup+, colg+
Alias of colgroup>col
<colgroup>

pic+

<!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"
9

"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/xht
ml1-transitional.dtd">
!!!xs
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xht
ml1-strict.dtd">
!!!xxs
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/x
html11.dtd">
c
<!-- ${child} -->
cc:ie6
<!--[if lte IE 6]> ${child} <![endif]-->
cc:ie
<!--[if IE]> ${child} <![endif]-->
cc:noie
<!--[if !IE]><!--> ${child} <!--<!
[endif]-->

position:absolute;
pos:r
position:relative;
pos:f
position:fixed;
t
top:;
t:a
top:auto;
r
right:;
r:a
right:auto;
b
bottom:;
b:a
bottom:auto;
l
left:;
l:a
left:auto;
z
z-index:;
z:a

CSS
Visual Formatting

z-index:auto;
f
foat:left;

pos

f:n

position:relative;

foat:none;

pos:s

f:l

position:static;

foat:left;

pos:a

f:r
10

foat:right;

display:table;

cl

d:itb

clear:both;

display:inline-table;

cl:n

d:tbcp

clear:none;

display:table-caption;

cl:l

d:tbcl

clear:left;

display:table-column;

cl:r

d:tbclg

clear:right;

display:table-column-group;

cl:b

d:tbhg

clear:both;

display:table-header-group;

d:tbfg

display:block;

display:table-footer-group;

d:n

d:tbr

display:none;

display:table-row;

d:b

d:tbrg

display:block;

display:table-row-group;

d:f

d:tbc

display:fex;

display:table-cell;

d:if

d:rb

display:inline-fex;

display:ruby;

d:i

d:rbb

display:inline;

display:ruby-base;

d:ib

d:rbbg

display:inline-block;

display:ruby-base-group;

d:li

d:rbt

display:list-item;

display:ruby-text;

d:ri

d:rbtg

display:run-in;

display:ruby-text-group;

d:cp

display:compact;

visibility:hidden;

d:tb

v:v
11

visibility:visible;

overfow-y:scroll;

v:h

ovy:a

visibility:hidden;

overfow-y:auto;

v:c

ovs

visibility:collapse;

overfow-style:scrollbar;

ov

ovs:a

overfow:hidden;

overfow-style:auto;

ov:v

ovs:s

overfow:visible;

overfow-style:scrollbar;

ov:h

ovs:p

overfow:hidden;

overfow-style:panner;

ov:s

ovs:m

overfow:scroll;

overfow-style:move;

ov:a

ovs:mq

overfow:auto;

overfow-style:marquee;

ovx

zoo, zm

overfow-x:hidden;

zoom:1;

ovx:v

cp

overfow-x:visible;

clip:;

ovx:h

cp:a

overfow-x:hidden;

clip:auto;

ovx:s

cp:r

overfow-x:scroll;

clip:rect(top right bottom left);

ovx:a

rsz

overfow-x:auto;

resize:;

ovy

rsz:n

overfow-y:hidden;

resize:none;

ovy:v

rsz:b

overfow-y:visible;

resize:both;

ovy:h

rsz:h

overfow-y:hidden;

resize:horizontal;

ovy:s

rsz:v
12

resize:vertical;

mr:a

cur

margin-right:auto;

cursor:${pointer};

mb

cur:a

margin-bottom:;

cursor:auto;

mb:a

cur:d

margin-bottom:auto;

cursor:default;

ml

cur:c

margin-left:;

cursor:crosshair;

ml:a

cur:ha

margin-left:auto;

cursor:hand;

cur:he

padding:;

cursor:help;

pt

cur:m

padding-top:;

cursor:move;

pr

cur:p

padding-right:;

cursor:pointer;

pb

cur:t

padding-bottom:;

cursor:text;

pl
padding-left:;

Margin & Padding


m

Box Sizing

margin:;

bxz

m:a

box-sizing:border-box;

margin:auto;

bxz:cb

mt

box-sizing:content-box;

margin-top:;

bxz:bb

mt:a

box-sizing:border-box;

margin-top:auto;

bxsh

mr

box-shadow:inset hoff voff blur color;

margin-right:;

bxsh:r

13

box-shadow:inset hoff voff blur spread


rgb(0, 0, 0);
bxsh:ra
box-shadow:inset h v blur spread
rgba(0, 0, 0, .5);
bxsh:n
box-shadow:none;
w
width:;
w:a
width:auto;
h
height:;
h:a
height:auto;
maw
max-width:;
maw:n
max-width:none;
mah
max-height:;
mah:n
max-height:none;
miw
min-width:;
mih
min-height:;

fw
font-weight:;
fw:n
font-weight:normal;
fw:b
font-weight:bold;
fw:br
font-weight:bolder;
fw:lr
font-weight:lighter;
fs
font-style:${italic};
fs:n
font-style:normal;
fs:i
font-style:italic;
fs:o
font-style:oblique;
fv
font-variant:;
fv:n
font-variant:normal;
fv:sc
font-variant:small-caps;
fz
font-size:;
fza

Font

font-size-adjust:;
fza:n

font:;

font-size-adjust:none;

f+

ff

font:1em Arial,sans-serif;

font-family:;
14

ff:s

femp:b

font-family:serif;

font-emphasize-position:before;

ff:ss

femp:a

font-family:sans-serif;

font-emphasize-position:after;

ff:c

fems

font-family:cursive;

font-emphasize-style:;

ff:f

fems:n

font-family:fantasy;

font-emphasize-style:none;

ff:m

fems:ac

font-family:monospace;

font-emphasize-style:accent;

ff:a

fems:dt

font-family: Arial, "Helvetica Neue",


Helvetica, sans-serif;

font-emphasize-style:dot;

ff:t
font-family: "Times New Roman",
Times, Baskerville, Georgia, serif;
ff:v
font-family: Verdana, Geneva, sansserif;

fems:c
font-emphasize-style:circle;
fems:ds
font-emphasize-style:disc;
fsm
font-smooth:;

fef

fsm:a

font-effect:;

font-smooth:auto;

fef:n

fsm:n

font-effect:none;

font-smooth:never;

fef:eg

fsm:aw

font-effect:engrave;

font-smooth:always;

fef:eb

fst

font-effect:emboss;

font-stretch:;

fef:o

fst:n

font-effect:outline;

font-stretch:normal;

fem

fst:uc

font-emphasize:;

font-stretch:ultra-condensed;

femp

fst:ec

font-emphasize-position:;

font-stretch:extra-condensed;
15

fst:c

vertical-align: sub;

font-stretch:condensed;

ta

fst:sc

text-align: left;

font-stretch:semi-condensed;

ta:l

fst:se

text-align: left;

font-stretch:semi-expanded;

ta:c

fst:e

text-align: center;

font-stretch:expanded;

ta:r

fst:ee

text-align:right;

font-stretch: extra-expanded;

ta:j

fst:ue

text-align: justify;

font-stretch: ultra-expanded;

ta-lst
text-align-last: ;
tal:a

Text

text-align-last: auto;
tal:l

vertical-align: top;
va:sup
vertical-align: super;
va:t
vertical-align: top;
va:tt
vertical-align: text-top;
va:m
vertical-align: middle;
va:bl
vertical-align: baseline;
va:b
vertical-align: bottom;
va:tb
vertical-align: text-bottom;
va:sub

text-align-last: left;
tal:c
text-align-last: center;
tal:r
text-align-last: right;
td
text-decoration: none;
td:n
text-decoration: none;
td:u
text-decoration: underline;
td:o
text-decoration: overline;
td:l
text-decoration: line-through;
te
16

text-emphasis:;

text-justify: auto;

te:n

tj:iw

text-emphasis: none;

text-justify: inter-word;

te:ac

tj:ii

text-emphasis:accent;

text-justify: inter-ideograph;

te:dt

tj:ic

text-emphasis: dot;

text-justify:inter-cluster;

te:c

tj:d

text-emphasis: circle;

text-justify:distribute;

te:ds

tj:k

text-emphasis: disc;

text-justify: kashida;

te:b

tj:t

text-emphasis: before;

text-justify: tibetan;

te:a

to

text-emphasis: after;

text-outline: ;

th

to+

text-height: ;

text-outline: 0 0 #000;

th:a

to:n

text-height: auto;

text-outline: none;

th:f

tr

text-height: font-size;

text-replace: ;

th:t

tr:n

text-height: text-size;

text-replace: none;

th:m

tt

text-height: max-size;

text-transform: uppercase;

ti

tt:n

text-indent: ;

text-transform:none;

ti:-

tt:c

text-indent: -9999px;

text-transform: capitalize;

tj

tt:u

text-justify: ;

text-transform: uppercase;

tj:a

tt:l
17

text-transform: lowercase;

white-space: pre;

tw

whs:nw

text-wrap: ;

white-space: nowrap;

tw:n

whs:pw

text-wrap: normal;

white-space: pre-wrap;

tw:no

whs:pl

text-wrap: none;

white-space: pre-line;

tw:u

whsc

text-wrap: unrestricted;

white-space-collapse: ;

tw:s

whsc:n

text-wrap: suppress;

white-space-collapse: normal;

tsh

whsc:k

text-shadow: hoff voff blur #000;

white-space-collapse: keep-all;

tsh:r

whsc:l

text-shadow: h v blur rgb(0, 0, 0);

white-space-collapse: loose;

tsh:ra

whsc:bs

text-shadow: h v blur rgba(0, 0, 0, .5);

white-space-collapse: break-strict;

tsh+

whsc:ba

text-shadow:0 0 0 #000;

white-space-collapse: break-all;

tsh:n

wob

text-shadow: none;

word-break: ;

lh

wob:n

line-height: ;

word-break: normal;

lts

wob:k

letter-spacing: ;

word-break: keep-all;

lts-n

wob:ba

letter-spacing: normal;

word-break: break-all;

whs

wos

white-space: ;

word-spacing: ;

whs:n

wow

white-space: normal;

word-wrap: ;

whs:p

wow:nm
18

word-wrap: normal;

background-repeat: repeat-y;

wow:n

bgr:sp

word-wrap: none;

background-repeat: space;

wow:u

bgr:rd

word-wrap: unrestricted;

background-repeat: round;

wow:s

bga

word-wrap: suppress;

background-attachment: ;

wow:b

bga:f

word-wrap: break-word;

background-attachment: fixed;

Background

bga:s
background-attachment: scroll;

bg
background: #000;
bg+
background: #fff url() 0 0 no-repeat;
bg:n
background: none;
bgc
background-color: #fff;
bgc:t
background-color: transparent;
bgi
background-image: url();
bgi:n
background-image: none;
bgr
background-repeat: ;
bgr:n
background-repeat: no-repeat;
bgr:x
background-repeat: repeat-x;
bgr:y

bgp
background-position:0 0;
bgpx
background-position-x: ;
bgpy
background-position-y: ;
bgbk
background-break: ;
bgbk:bb
background-break: bounding-box;
bgbk:eb
background-break: each-box;
bgbk:c
background-break: continuous;
bgcp
background-clip: padding-box;
bgcp:bb
background-clip: border-box;
bgcp:pb
background-clip: padding-box;
bgcp:cb
19

background-clip: content-box;

content:'';

bgcp:nc

cnt:n, ct:n

background-clip: no-clip;

content: normal;

bgo

cnt:oq, ct:oq

background-origin: ;

content: open-quote;

bgo:pb

cnt:noq, ct:noq

background-origin: padding-box;

content: no-open-quote;

bgo:bb

cnt:cq, ct:cq

background-origin: border-box;

content: close-quote;

bgo:cb

cnt:ncq, ct:ncq

background-origin: content-box;

content: no-close-quote;

bgsz

cnt:a, ct:a

background-size: ;

content: attr();

bgsz:a

cnt:c, ct:c

background-size: auto;

content: counter();

bgsz:ct

cnt:cs, ct:cs

background-size: contain;

content: counters();

bgsz:cv

ct

background-size: cover;

content: ;
q

Color

quotes: ;
q:n

color: #000;
c:r
color: rgb(0, 0, 0);
c:ra
color: rgba(0, 0, 0, .5);
op
opacity: ;

quotes: none;
q:ru
quotes:'\00AB' '\00BB' '\201E' '\201C';
q:en
quotes:'\201C' '\201D' '\2018' '\2019';
coi
counter-increment: ;
cor

Generated content

counter-reset: ;

cnt
20

Outline
ol
outline: ;
ol:n
outline: none;
olo
outline-offset: ;

outline-style: inset;
ols:o
outline-style:outset;
olc
outline-color: #000;
olc:i
outline-color: invert;

olw
outline-width: ;
olw:tn
outline-width: thin;
olw:m
outline-width: medium;
olw:tc
outline-width: thick;
ols
outline-style: ;
ols:n
outline-style: none;
ols:dt
outline-style: dotted;
ols:ds
outline-style: dashed;
ols:s
outline-style :solid;
ols:db
outline-style: double;

Tables
tbl
table-layout: ;
tbl:a
table-layout: auto;
tbl:f
table-layout: fixed;
cps
caption-side: ;
cps:t
caption-side: top;
cps:b
caption-side: bottom;
ec
empty-cells: ;
ec:s
empty-cells: show;
ec:h
empty-cells: hide;

ols:g
outline-style: groove;
ols:r

Border

outline-style: ridge;

bd

ols:i

border: ;
21

bd+

bdbi:n

border: 1px solid #000;

border-bottom-image: none;

bd:n

bdli

border: none;

border-left-image :url();

bdbk

bdli:n

border-break: close;

border-left-image: none;

bdbk:c

bdci

border-break: close;

border-corner-image: url();

bdcl

bdci:n

border-collapse: ;

border-corner-image: none;

bdcl:c

bdci:c

border-collapse: collapse;

border-corner-image: continue;

bdcl:s

bdtli

border-collapse: separate;

border-top-left-image: url();

bdc

bdtli:n

border-color: #000;

border-top-left-image: none;

bdc:t

bdtli:c

border-color: transparent;

border-top-left-image: continue;

bdi

bdtri

border-image: url();

border-top-right-image: url();

bdi:n

bdtri:n

border-image: none;

border-top-right-image: none;

bdti

bdtri:c

border-top-image: url();

border-top-right-image: continue;

bdti:n

bdbri

border-top-image: none;

border-bottom-right-image: url();

bdri

bdbri:n

border-right-image: url();

border-bottom-right-image: none;

bdri:n

bdbri:c

border-right-image: none;

border-bottom-right-image: continue;

bdbi

bdbli

border-bottom-image: url();

border-bottom-left-image: url();
22

bdbli:n

bds:dt

border-bottom-left-image: none;

border-style: dotted;

bdbli:c

bds:ds

border-bottom-left-image: continue;

border-style: dashed;

bdf

bds:s

border-fit: repeat;

border-style: solid;

bdf:c

bds:db

border-fit: clip;

border-style: double;

bdf:r

bds:dtds

border-fit: repeat;

border-style: dot-dash;

bdf:sc

bds:dtdtds

border-fit: scale;

border-style: dot-dot-dash;

bdf:st

bds:w

border-fit: stretch;

border-style: wave;

bdf:ow

bds:g

border-fit: overwrite;

border-style: groove;

bdf:of

bds:r

border-fit: overfow;

border-style: ridge;

bdf:sp

bds:i

border-fit: space;

border-style: inset;

bdlen

bds:o

border-length: ;

border-style: outset;

bdlen:a

bdw

border-length: auto;

border-width: ;

bdsp

bdt, bt

border-spacing: ;

border-top: ;

bds

bdt+

border-style: ;

border-top: 1px solid #000;

bds:n

bdt:n

border-style: none;

border-top: none;

bds:h

bdtw

border-style: hidden;

border-top-width: ;
23

bdts

bdbs

border-top-style: ;

border-bottom-style: ;

bdts:n

bdbs:n

border-top-style: none;

border-bottom-style: none;

bdtc

bdbc

border-top-color: #000;

border-bottom-color: #000;

bdtc:t

bdbc:t

border-top-color: transparent;

border-bottom-color: transparent;

bdr, br

bdl, bl

border-right: ;

border-left: ;

bdr+

bdl+

border-right: 1px solid #000;

border-left: 1px solid #000;

bdr:n

bdl:n

border-right: none;

border-left: none;

bdrw

bdlw

border-right-width: ;

border-left-width: ;

bdrst

bdls

border-right-style: ;

border-left-style: ;

bdrst:n

bdls:n

border-right-style: none;

border-left-style: none;

bdrc

bdlc

border-right-color: #000;

border-left-color: #000;

bdrc:t

bdlc:t

border-right-color: transparent;

border-left-color: transparent;

bdb, bb

bdrs

border-bottom: ;

border-radius: ;

bdb+

bdtrrs

border-bottom: 1px solid #000;

border-top-right-radius: ;

bdb:n

bdtlrs

border-bottom: none;

border-top-left-radius: ;

bdbw

bdbrrs

border-bottom-width: ;

border-bottom-right-radius: ;
24

bdblrs

list-style-type: upper-roman;

border-bottom-left-radius: ;

lisi
list-style-image: ;

Lists

lisi:n
list-style-image: none;

lis
list-style: ;
lis:n

Print

list-style: none;

pgbb

lisp

page-break-before: ;

list-style-position: ;

pgbb:au

lisp:i

page-break-before: auto;

list-style-position: inside;

pgbb:al

lisp:o

page-break-before: always;

list-style-position: outside;

pgbb:l

list

page-break-before: left;

list-style-type: ;

pgbb:r

list:n

page-break-before: right;

list-style-type: none;

pgbi

list:d

page-break-inside: ;

list-style-type: disc;

pgbi:au

list:c

page-break-inside: auto;

list-style-type: circle;

pgbi:av

list:s

page-break-inside: avoid;

list-style-type: square;

pgba

list:dc

page-break-after: ;

list-style-type: decimal;

pgba:au

list:dclz

page-break-after: auto;

list-style-type: decimal-leading-zero;

pgba:al

list:lr

page-break-after: always;

list-style-type: lower-roman;

pgba:l

list:ur

page-break-after: left;

25

pgba:r
page-break-after: right;
orp
orphans: ;
wid
widows: ;

to { }
}
@keyframes identifier {
from { }
to { }
}
@m, @media
@media screen { }

Others

ac

align-content:;

!important

ac:c

@f

align-content:center;

@font-face { font-family:; src:url(|); }

ac:fe

@f+

align-content:fex-end;

@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#FontNa
me')
format('svg');
font-style: normal;
font-weight: normal;
}

ac:fs

@i, @import

ai:b

@import url();

align-items:baseline;

@kf

ai:c

@-webkit-keyframes identifier {
from { }
to { }
}
@-o-keyframes identifier {
from { }
to { }
}
@-moz-keyframes identifier {
from { }

align-items:center;

align-content:fex-start;
ac:s
align-content:stretch;
ac:sa
align-content:space-around;
ac:sb
align-content:space-between;
ai
align-items:;

ai:fe
align-items:fex-end;
ai:fs
align-items:fex-start;
ai:s
align-items:stretch;
26

anim

animation-name: none;

animation:;

animps

anim-

animation-play-state: running;

animation:name duration timingfunction delay iteration-count direction


fill-mode;

animps:p

animdel
animation-delay: time;
animdir
animation-direction: normal;
animdir:a
animation-direction: alternate;
animdir:ar
animation-direction: alternate-reverse;
animdir:n
animation-direction: normal;
animdir:r
animation-direction: reverse;

animation-play-state: paused;
animps:r
animation-play-state: running;
animtf
animation-timing-function: linear;
animtf:cb
animation-timing-function: cubicbezier(0.1, 0.7, 1.0, 0.1);
animtf:e
animation-timing-function: ease;
animtf:ei
animation-timing-function: ease-in;
animtf:eio

animdur

animation-timing-function: ease-inout;

animation-duration:0s;

animtf:eo

animfm

animation-timing-function: ease-out;

animation-fill-mode: both;

animtf:l

animfm:b

animation-timing-function: linear;

animation-fill-mode: backwards;

ap

animfm:bt, animfm:bh

appearance:${none};

animation-fill-mode: both;

as

animfm:f

align-self: ;

animation-fill-mode: forwards;

as:a

animic

align-self: auto;

animation-iteration-count: 1;

as:b

animic:i

align-self: baseline;

animation-iteration-count: infinite;

as:c

animn

align-self: center;
27

as:fe

column-rule-width: ;

align-self: fex-end;

colms

as:fs

column-span: ;

align-self: fex-start;

colmw

as:s

column-width: ;

align-self: stretch;

d:ib+

bfv

display: inline-block;
*display: inline;
*zoom: 1;

backface-visibility: ;
bfv:h
backface-visibility: hidden;
bfv:v
backface-visibility: visible;
bg:ie
filter:progid:DXImageTransform.Micros
oft.AlphaImageLoader(src='x.png',sizi
ngMethod='crop');

fx
fex: ;
fxb
fex-basis: ;
fxd
fex-direction: ;
fxd:c

cm

fex-direction: column;

/* ${child} */

fxd:cr

colm

fex-direction: column-reverse;

columns: ;

fxd:r

colmc

fex-direction: row;

column-count: ;

fxd:rr

colmf

fex-direction: row-reverse;

column-fill: ;

fxf

colmg

fex-fow: ;

column-gap: ;

fxg

colmr

fex-grow: ;

column-rule: ;

fxsh

colmrc

fex-shrink: ;

column-rule-color: ;

fxw

colmrs

fex-wrap: ;

column-rule-style: ;

fxw:n

colmrw

fex-wrap: nowrap;
28

fxw:w

orientation: ;

fex-wrap: wrap;

ori:l

fxw:wr

orientation: landscape;

fex-wrap: wrap-reverse;

ori:p

jc

orientation: portrait;

justify-content: ;

tov

jc:c

text-overfow: ${ellipsis};

justify-content: center;

tov:c

jc:fe

text-overfow: clip;

justify-content: fex-end;

tov:e

jc:fs

text-overfow: ellipsis;

justify-content: fex-start;

trf

jc:sa

transform: ;

justify-content: space-around;

trf:r

jc:sb

transform: rotate(angle);

justify-content: space-between;

trf:rx

mar

transform: rotateX(angle);

max-resolution: res;

trf:ry

mir

transform: rotateY(angle);

min-resolution: res;

trf:rz

op+

transform: rotateZ(angle);

opacity: ;
filter: alpha(opacity=);

trf:sc

op:ie

trf:sc3

filter:progid:DXImageTransform.Micros
oft.Alpha(Opacity=100);

transform: scale3d(x, y, z);

op:ms
-msfilter:'progid:DXImageTransform.Micros
oft.Alpha(Opacity=100)';

transform: scale(x, y);

trf:scx
transform: scaleX(x);
trf:scy
transform: scaleY(y);

ord

trf:scz

order: ;

transform: scaleZ(z);

ori

trf:skx
29

transform: skewX(angle);

wfsm:a

trf:sky

-webkit-font-smoothing: antialiased;

transform: skewY(angle);

wfsm:n

trf:t

-webkit-font-smoothing: none;

transform: translate(x, y);

wfsm:s, wfsm:sa

trf:t3

-webkit-font-smoothing: subpixelantialiased;

transform: translate3d(tx, ty, tz);


trf:tx
transform: translateX(x);
trf:ty
transform: translateY(y);
trf:tz
transform: translateZ(z);
trfo
transform-origin: ;
trfs
transform-style: preserve-3d;
trs
transition: prop time;
trsde
transition-delay: time;
trsdu
transition-duration: time;
trsp
transition-property: prop;

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;
wm:rlt
writing-mode: rl-tb;
wm:tbl
writing-mode: tb-lr;
wm:tbr
writing-mode: tb-rl;

trstf
transition-timing-function: tfunc;
us
user-select: ${none};
wfsm
-webkit-font-smoothing: $
{antialiased};

30

31

You might also like