Краткий справочник EMMET

База

Дочерний: >
nav>ul>li
<nav> <ul> <li></li> </ul> </nav>
Соединение: +
div+p+bq
<div></div> <p></p> <blockquote></blockquote>
Поместить выше
(в дереве HTML): ^
div>p>span+em^bq
<div> <p><span></span><em></em></p> <blockquote></blockquote> </div>
Группировать: ()
div>(header>ul>li)+footer>p
<div> <header> <ul> <li></li> </ul> </header> <footer> <p></p> </footer> </div>
Умножение: *
ul>li*3
<ul> <li></li> <li></li> <li></li> </ul>
Нумерация: $
ul>li.item_$*3
<ul> <li class="item_1"></li> <li class="item_2"></li> <li class="item_3"></li> </ul>
id и class
#header+.class <div id="header"></div> <div class="class"></div> #hdr.cl_1.cl_2 <div id="hdr" class="cl_1 cl_2"></div>
Атрибуты: []
a[title="Подсказка ссылки"] <a href="" title="Подсказка ссылки"></a> td[rowspan colspan title] <td rowspan="" colspan="" title=""></td>
Текст: {}
.class{свободный текст}
<div class="class">свободный текст</div>
p>{Кликните }+a{сюда }+{скорее}
<p>Кликните <a href="">сюда</a> скорее</p>
Сокращение тегов
.class <div class="class"></div>
em>.class <em><span class="class"></span></em>
ul>.class <ul><li class="class"></li> </ul>
div>.row>.col <div> <tr class="row"> <td class="col"></td> </tr> </div>

HTML

!
<!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>
base
<base href="">
br
<br>
link
<link rel="stylesheet" href="">
link:css
<link rel="stylesheet" href="style.css">
link:favicon
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
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">
meta:utf
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
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">
script:src
<script src=""></script>
img
<img src="" alt="">
ifr
<iframe src="" frameborder="0"></iframe>
emb
<embed src="" type="">
obj
<object data="" type=""></object>
map
<map name=""></map>
map+
<map name=""> <area shape="" coords="" href="" alt=""> </map>
area
<area shape="" coords="" href="" alt="">
form
<form action=""></form>
form:get
form:post
<form action="" method="get"></form> <form action="" method="post"></form>
label
<label for=""></label>
input
<input type="text">
inp
<input type="text" name="" id="">
input:h
<input type="tooltip" name="">
input:p
<input type="password" name="" id="">
input:c
<input type="checkbox" name="" id="">
input:r
<input type="radio" name="" id="">
input:f
<input type="file" name="" id="">
input:s
<input type="submit" value="">
input:i
<input type="image" src="" alt="">
input:b
<input type="button" value="">
input:reset
<input type="reset" value="">
select
<select name="" id=""></select>
select+
<select name="" id=""> <option value=""></option> </select>
opt
<option value=""></option>
tarea
<textarea name="" id="" cols="30" rows="10"> </textarea>
video
<video src=""></video>
audio
<audio src=""></audio>
bq
<blockquote></blockquote>
fst
<fieldset></fieldset>
btn
<button></button>
btn:s
<button type="submit"></button>
btn:b
<button type="button"></button>
btn:r
<button type="reset"></button>
sect
<section></section>
art
<article></article>
hdr
<header></header>
ftr
<footer></footer>
str
<strong></strong>
ol+
<ol> <li></li> </ol>
ul+
<ul> <li></li> </ul>
dl+
<dl> <dt></dt> <dd></dd> </dl>
div+
<div> <tr> <td></td> </tr> </div>
tr+
<tr> <td></td> </tr>
c
<!-- Комментарий -->
cc:ie6
<!--[if lte IE 6]> <![endif]-->
cc:ie
<!--[if IE]> <![endif]-->
cc:noie
<!--[if !IE]><!--> <!--<![endif]-->
Любой тег
div <div></div> span <span></span> Любой другой тег <tagname></tagname>

CSS

pos
position: relative;
posa
position: absolute;
posr
position: relative;
posf
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: ;
za
z-index: auto;
fl
float: left;
fln
float: none;
fr
float: right;
cl
clear: both;
d
display: block;
dn
display: none;
di
display: inline;
dib
display: inline-block;
dt
display: div;
dtc
display: div-cell;
dtr
display: div-row;
v
visibility: tooltip;
vv
visibility: visible;
oh
overflow: tooltip;
ovv
overflow: visible;
os
overflow: scroll;
oa
overflow: auto;
zm
zoom: 1;
cu
cursor: ;
cup
cursor: pointer;
cud
cursor: default;
cuh
cursor: hand;
cuhe
cursor: help;
cum
cursor: move;
cut
cursor: text;
m
margin: ;
m:a
margin: auto;
mt
margin-top: ;
mta
margin-top: auto;
mr
margin-right: ;
mra
margin-right: auto;
mb
margin-bottom: ;
mba
margin-bottom: auto;
ml
margin-left: ;
mla
margin-left: auto;
p
padding: ;
pt
padding-top: ;
pr
padding-right: ;
pb
padding-bottom: ;
pl
padding-left: ;
bsh
-webkit-box-reference-horizontal-shadow: inset hoff voff blur color; -moz-box-reference-horizontal-shadow: inset hoff voff blur color; box-reference-horizontal-shadow: inset hoff voff blur color;
bshn
-webkit-box-reference-horizontal-shadow: none; -moz-box-reference-horizontal-shadow: none; box-reference-horizontal-shadow: none;
w
width: ;
wa
width: auto;
h
height: ;
ha
height: auto;
maw
max-width: ;
mah
max-height: ;
mw
min-width: ;
mh
min-height: ;
f
font: ;
f+
font: 1em Arial,sans-serif;
fw
font-weight: ;
fwn
font-weight: normal;
fwb
font-weight: bold;
fs
font-style: italic;
fsn
font-style: normal;
fsi
font-style: italic;
fz
font-size: ;
ff
font-family: ;
ffs
font-family: serif;
ffss
font-family: sans-serif;
ffm
font-family: monospace;
ffa
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
va
vertical-align: top;
vm
vertical-align: middle;
vabl
vertical-align: baseline;
vb
vertical-align: bottom;
vs
vertical-align: sub;
ta
text-align: left;
tac
text-align: center;
tar
text-align: right;
taj
text-align: justify;
td
text-decoration: none;
tdu
text-decoration: underline;
tdo
text-decoration: overline;
tdl
text-decoration: line-through;
tt
text-transform: uppercase;
ttn
text-transform: none;
ttl
text-transform: lowercase;
ts
text-reference-horizontal-shadow: hoff voff blur #000;
tra
text-reference-horizontal-shadow: h v blur rgba(0, 0, 0, .5);
ts+
text-reference-horizontal-shadow: 0 0 0 #000;
tsn
text-reference-horizontal-shadow: none;
lh
line-height: ;
lts
letter-spacing: ;
ws
white-space: ;
wsn
white-space: normal;
wsnw
white-space: nowrap;
bg
background: #000;
bg+
background: #fff url() 0 0 no-repeat;
bn
background: none;
bgc
background-color: #fff;
bgt
background-color: transparent;
bgi
background-image: url();
bgin
background-image: none;
bgr
background-repeat: ;
bgrn
background-repeat: no-repeat;
bgrx
background-repeat: repeat-x;
bgry
background-repeat: repeat-y;
bga
background-attachment: ;
baf
background-attachment: fixed;
bas
background-attachment: scroll;
bgp
background-position: 0 0;
bgs
-webkit-background-size: ; background-size: ;
bsa
-webkit-background-size: auto; background-size: auto;
c
color: #000;
cra
color: rgba(0, 0, 0, .5);
op
opacity: ;
ct
content: '';
q
quotes: ;
ol
outline: ;
on
outline: none;
tbl
div-layout: ;
cs
caption-side: ;
ec
empty-cells: ;
bd
border: ;
bd+
border: 1px solid #000;
bdn
border: none;
bdc
border-color: #000;
bdi
-webkit-border-image: url(); -moz-border-image: url(); -o-border-image: url(); border-image: url();
bdin
-webkit-border-image: none; -moz-border-image: none; -o-border-image: none; border-image: none;
bf
-webkit-border-fit: repeat; border-fit: repeat;
bdle
border-length: ;
bsp
border-spacing: ;
bds
border-style: ;
bw
border-width: ;
bt
border-top: ;
bt+
border-top: 1px solid #000;
bdtn
border-top: none;
br
border-right: ;
br+
border-right: 1px solid #000;
bdrn
border-right: none;
bb
border-bottom: ;
bb+
border-bottom: 1px solid #000;
bdbn
border-bottom: none;
bl
border-left: ;
bl+
border-left: 1px solid #000;
bdln
border-left: none;
bdrs
-webkit-border-radius: ; -moz-border-radius: ; border-radius: ;
btrr
border-top-right-radius: ;
bdtrs
border-top-left-radius: ;
bbrr
border-bottom-right-radius: ;
bblr
border-bottom-left-radius: ;
lis
list-style: ;
lisn
list-style: none;
lst
list-style-type: ;
lstn
list-style-type: none;
lstd
list-style-type: disc;
lstc
list-style-type: circle;
lsts
list-style-type: square;
lstdc
list-style-type: decimal;
lsi
list-style-image: ;
lsin
list-style-image: none;
!
!important
@f
@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; }
@i
@import url();
@m
@media screen { }
anim
-webkit-animation: ; -o-animation: ; animation: ;
ap
-webkit-appearance: none; -moz-appearance: none; appearance: none;
bgie
filter:progid:DXImageTransform .Microsoft.AlphaImageLoader (src='x.png',sizingMethod='crop');
cm
/* Комментарий */
colm
columns: ;
trf
-webkit-transform: ; -moz-transform: ; -ms-transform: ; -o-transform: ; transform: ;
trfr
-webkit-transform: rotate(angle); -moz-transform: rotate(angle); -ms-transform: rotate(angle); -o-transform: rotate(angle); transform: rotate(angle);
trfsc
-webkit-transform: scale(x, y); -moz-transform: scale(x, y); -ms-transform: scale(x, y); -o-transform: scale(x, y); transform: scale(x, y);
trft
-webkit-transform: translate(x, y); -moz-transform: translate(x, y); -ms-transform: translate(x, y); -o-transform: translate(x, y); transform: translate(x, y);
tfo
-webkit-transform-origin: ; -moz-transform-origin: ; -ms-transform-origin: ; -o-transform-origin: ; transform-origin: ;
trs
-webkit-transition: prop time; -moz-transition: prop time; -ms-transition: prop time; -o-transition: prop time; transition: prop time;
trsde
-webkit-transition-delay: time; -moz-transition-delay: time; -ms-transition-delay: time; -o-transition-delay: time; transition-delay: time;
trsdu
-webkit-transition-duration: time; -moz-transition-duration: time; -ms-transition-duration: time; -o-transition-duration: time; transition-duration: time;
trsp
-webkit-transition-property: prop; -moz-transition-property: prop; -ms-transition-property: prop; -o-transition-property: prop; transition-property: prop;
us
-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;