Emmet Cheat Sheet.pdf | Xhtml | Html
Short Description
Emmet Cheat Sheet.pdf. Cargado por pedrojoya ...... What Beautiful HTML Code Looks Like · Fix Your Site With the Right D...
Description
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 href=""> li>
Multiplication: * ul>li*5
Item num bering: $
(div>dl>(dt+dd)*3)+footer>p
ul>li.item$*5
ul>li.item$@-*5
ul>li.item$@3*5
class="item7">
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}
Click me
Click here to continue
Implicit tag names .class
em>.class
table>.row>.col
HTML All unknown abbreviations will be t ransf ormed to t ag, e.g. foo → .
ul>.class
!
a
a:mail
acronym
basefont
base br
frame
col
hr
link
link:print
bdo:r
link:css
abbr
bdo
bdo:l
Document
a:link
Alias of html:5
link:touch
link:rss
meta
meta:vp
title="Atom" href=" atom.xml " />
meta:utf
meta:compat
script:src
link:atom
Alias of menu:context
Alias of menu[type=toolbar]>
menu:t
video
Alias of menu:toolbar
audio
html:xml
keygen
command
bq
acr
Alias of blockquote
Alias of acronym
fig
figc
ifr
Alias of figure
Alias of figcaption
Alias of iframe
emb
obj
src
Alias of embed
Alias of object
Alias of source
cap
colg
Alias of caption btn
fst, fset
Alias of colgroup
Alias of fieldset
btn:b
btn:r
Alias of button
Alias of button[type=button]
Alias of button[type=reset]
btn:s
optg
opt
Alias of button[type=submit]
Alias of optgroup
Alias of option
tarea
leg
sect
Alias of textarea
Alias of legend
Alias of section
ftr
art
hdr
Alias of article
Alias of header
adr
dlg
Alias of footer
Alias of address
Alias of dialog
str
prog
datag
Alias of strong
Alias of progress
Alias of datagrid
datal
kg
Alias of datalist
cmd
Alias of details
Alias of output
det
out
Alias of keygen
doc
Alias of command
Alias of html>(head>meta[charset=UTF-
8]+title{${1:Document}})+body
Document
doc4
html:4t
Alias of html>(head>meta[http-equiv="ContentType" content="text/html;charset=${charset}"]+title {${1:Document}})+body
Document
html:4s
Alias of !!!4t+doc4[lang=${lang}]
Alias of !!!4s+doc4[lang=${lang}]
Document
Document
html:xt
Alias of !!!xt+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}]
Document
html:xs
html:xxs
Alias of
Alias of
!!!xs+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}]
!!!xxs+doc4[xmlns=http://www.w3.org/1999/xhtm l xml:lang=${lang}]
Document
Alias of !!!+doc[lang=${lang}]
Document
Document ol+
Alias of ol>li
ul+
html:5
dl+
map+
Alias of ul>li
Alias of dl>dt+dd
Alias of map>area
table+
Alias of table>tr>td colgroup+, colg+
tr+
Alias of colgroup>col optgroup+, optg+
Alias of optgroup>option
select+
Alias of tr>td
Alias of select>option
!!!
!!!4t
!!!4s
!!!xt
!!!xs
!!!xxs
c
${child} -->
cc:noie
${child}
CSS CSS module uses fuzzy search to find unknown abbreviations, e.g. ov:h == ov-h == ovh == oh . If abbreviation wasn’t f ound, it is transformed into property name: foo-bar → foo-bar: |; You can prefix abbrev iations with hyphen to produce vendor-pref ixed properties: -foo
Visual Formatting pos
position: relative ;
pos:s
position:static;
pos:r
position:relative;
pos:a
position:absolute;
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
z-index:auto;
fl
float: left ;
fl:n
float:none;
fl:l
float:left;
cl:n
clear:none;
cl:l
clear:left;
fl:r
cl:r
clear:right;
d:n
display:none;
d:ib
display:inline-block;
d:cp
display:compact;
d:tbcp
display:table-caption;
d:tbhg
display:table-header-group;
d:tbrg
display:table-row-group;
d:rbb d:rbtg
cl
float:right;
display:ruby-base; display:ruby-text-group;
clear: both ;
cl:b
clear:both;
d
display: block ;
d:b
display:block;
d:i
display:inline;
d:li
display:list-item;
d:ri
display:run-in;
d:tb
display:table;
d:itb
display:inline-table;
d:tbcl
display:table-column;
d:tbclg
display:table-column-group;
d:tbfg
display:table-footer-group;
d:tbr
display:table-row;
d:tbc
display:table-cell;
d:rb
display:ruby;
d:rbt
display:ruby-text;
v:v
visibility:visible;
v:h
visibility:hidden;
d:rbbg v
display:ruby-base-group; visibility: hidden ;
v:c
ov
visibility:collapse;
ov:s
overflow:scroll;
ovx:v
overflow-x:visible;
ovx:a
overflow-x:auto;
ovy:s
overflow-y:scroll;
ovs:a
overflow-style:auto;
ovs:m
overflow-style:move;
cp
clip: ;
overflow: hidden ;
ov:a
overflow:auto;
ovx:h
overflow-x:hidden;
ovy
overflow-y: hidden ;
ovy:a
overflow-y:auto;
ovs:s
overflow-style:scrollbar;
ovs:mq
overflow-style:marquee;
cp:a
clip:auto;
ov:v
overflow:visible;
ov:h
overflow:hidden;
ovx
overflow-x: hidden ;
ovx:s
overflow-x:scroll;
ovy:v
overflow-y:visible;
ovy:h
overflow-y:hidden;
ovs
overflow-style: scrollbar ;
ovs:p
overflow-style:panner;
zoo, zm
zoom:1;
cp:r
clip:rect( top
right
bottom
left ); rsz
resize: ;
rsz:h
resize:horizontal;
cur:a
cursor:auto;
cur:ha
cursor:hand;
rsz:n
resize:none;
rsz:v
resize:vertical;
cur:d
cursor:default;
resize:both;
cur
cursor:${pointer};
cur:c
cursor:crosshair;
cur:m
cursor:move;
mt
margin-top: ;
mr:a
margin-right:auto;
cur:he
cursor:help;
cur:t
cursor:text;
margin: ;
m:a
margin:auto;
mt:a
margin-top:auto;
mr
margin-right: ;
mb
margin-bottom: ;
mb:a
margin-bottom:auto;
ml
margin-left: ;
ml:a
margin-left:auto;
p
padding: ;
pt
padding-top: ;
pr
padding-right: ;
pb
padding-bottom: ;
pl
padding-left: ;
bxz:cb
box-sizing:content-box;
bxz:bb
box-sizing:border-box;
bxsh
box-shadow: inset
bxsh:r
box-shadow: inset
cur:p
cursor:pointer;
rsz:b
Margin & Padding m
Box Sizing bxz
box-sizing: border-box ;
blur bxsh:ra
box-shadow: inset spread
rgba( 0 ,
h:a
height:auto;
mah
max-height: ;
mih
min-height: ;
h 0 ,
v
blur 0 , . 5 );
hoff
voff
color ;
blur
spread
bxsh:n
box-shadow:none;
w
width: ;
w:a
width:auto;
h
height: ;
maw
max-width: ;
maw:n
max-width:none;
mah:n
max-height:none;
miw
min-width: ;
hoff
rgb( 0 ,
voff 0 ,
0 );
Font f
f+
font: ;
fw:b
font-weight:bold;
fs
font-style:${italic};
fs:o
Arial,sans-serif ;
fw
font-weight: ;
fw:n
font-weight:normal;
fw:br
font-weight:bolder;
fw:lr
font-weight:lighter;
fs:n
font-style:normal;
fs:i
font-style:italic;
font-style:oblique;
fv
font-variant: ;
fv:n
font-variant:normal;
fv:sc
font-variant:small-caps;
fz
font-size: ;
fza
font-size-adjust: ;
fza:n
font-size-adjust:none;
ff
font-family: ;
ff:ss ff:m
font: 1em
font-family:sans-serif;
ff:c
font-family:monospace;
ff:a
fef:eg
font-effect:engrave;
fem
font-emphasize: ;
femp:a
font-emphasize-position:after;
fems:ac
font-emphasize-style:accent;
fems:ds
font-emphasize-style:disc;
fsm:n
font-smooth:never;
fst:n
font-stretch:normal;
fst:c
font-stretch:condensed;
fst:e
font-family:cursive;
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
font-family:serif; font-family:fantasy;
fef
font-effect: ;
fef:n
font-effect:none;
fef:o
font-effect:outline;
femp:b
font-emphasize-position:before;
fems:n
font-emphasize-style:none;
fems:c
font-emphasize-style:circle;
fsm:a
font-smooth:auto;
fst
font-stretch: ;
fef:eb
font-effect:emboss;
femp
font-emphasize-position: ;
fems
font-emphasize-style: ;
fems:dt
font-emphasize-style:dot;
fsm
font-smooth: ;
fsm:aw
font-smooth:always;
fst:uc
font-stretch:ultra-condensed;
fst:ec
font-stretch:extra-condensed;
fst:sc
font-stretch:semi-condensed;
fst:se
font-stretch:semi-expanded;
font-stretch:expanded;
fst:ee
font-stretch:extra-expanded;
fst:ue
font-stretch:ultra-expanded;
vertical-align: top ;
va:sup
vertical-align:super;
va:t
vertical-align:top;
va:m
vertical-align:middle;
va:tb
vertical-align:text-bottom;
ta:l
text-align:left;
ta:c
text-align:center;
ta-lst
text-align-last: ;
tal:c
text-align-last:center;
td:n
text-decoration:none;
td:u
text-decoration:underline;
te
text-emphasis: ;
ff:s ff:f
Text va
va:tt va:bl va:sub
vertical-align:baseline;
text-align:right;
tal:a
text-align-last:auto;
tal:r
text-align-last:right;
text-decoration:overline;
va:b ta
vertical-align:sub;
ta:r
td:o
vertical-align:text-top;
vertical-align:bottom; text-align: left ;
ta:j
text-align:justify;
tal:l
text-align-last:left;
td
text-decoration: none ;
td:l
text-decoration:line-through;
te:n
text-emphasis:none;
te:c
text-emphasis:circle;
te:a
text-emphasis:after;
th:f
text-height:font-size;
ti
text-indent: ;
tj:a
text-justify:auto;
tj:ic
text-justify:inter-cluster;
tj:t
text-justify:tibetan;
to:n
text-outline:none;
tt
te:ac
text-emphasis:accent;
te:ds
text-emphasis:disc;
th
text-height: ;
th:t
text-height:text-size;
ti:-
text-indent:-9999px;
tj:iw
text-transform: uppercase ;
text-wrap: ;
tw:u
text-wrap:unrestricted;
text-justify:inter-word;
tj:d
text-justify:distribute;
to
text-outline: ;
tr
text-replace: ;
tt:n
tt:u tw
text-transform:none;
text-transform:uppercase;
tw:n
text-wrap:normal;
tw:s
text-wrap:suppress;
te:dt
text-emphasis:dot;
te:b
text-emphasis:before;
th:a
text-height:auto;
th:m
text-height:max-size;
tj
text-justify: ;
tj:ii
text-justify:inter-ideograph;
tj:k
text-justify:kashida;
to+
text-outline: 0
0
#000 ;
tr:n
text-replace:none;
tt:c
text-transform:capitalize;
tt:l
text-transform:lowercase;
tw:no
text-wrap:none;
tsh
text-shadow: hoff
voff
blur
0
#000 ;
#000 ; tsh:r
text-shadow: h 0 ,
v
tsh:ra
blur rgb( 0 ,
0 );
text-shadow: h 0 ,
lh
line-height: ;
whs:n
white-space:normal;
whs:pw
white-space:pre-wrap;
whsc:n
white-space-collapse:normal;
whsc:bs
white-space-collapse:break-strict;
wob:n
word-break:normal;
wob:bs
word-break:break-strict;
wow
word-wrap: ;
wow:u
word-wrap:unrestricted;
v
tsh+
text-shadow: 0
tsh:n
text-shadow:none;
whs
white-space: ;
whs:nw
white-space:nowrap;
whsc
white-space-collapse: ;
whsc:l
white-space-collapse:loose;
wob
word-break: ;
wob:l
word-break:loose;
wos
word-spacing: ;
wow:n
word-wrap:none;
wow:b
word-wrap:break-word;
0
bg:n
background:none;
bgc
background-color:# fff ;
bgi:n
background-image:none;
bgr:x
background-repeat:repeat-x;
blur rgba( 0 ,
0 , . 5 );
lts
letter-spacing: ;
whs:p
white-space:pre;
whs:pl
white-space:pre-line;
whsc:k
white-space-collapse:keep-all;
whsc:ba
white-space-collapse:break-all;
wob:k
word-break:keep-all;
wob:ba
word-break:break-all;
wow:nm
word-wrap:normal;
wow:s
word-wrap:suppress;
bg+
background: #fff url( )
0
Background bg
background: ;
0
no-repeat ; bgc:t
background-color:transparent;
bgr
background-repeat: ;
bgi
background-image:url( );
bgr:n
background-repeat:no-repeat;
bgr:y
background-repeat:repeat-y;
bga
background-attachment: ;
bgp
background-position: 0
0 ;
bgr:sp
background-repeat:space;
bga:f
background-attachment:fixed;
bgpx
background-position-x: ;
bgbk
background-break: ;
bgr:rd
background-repeat:round;
bga:s
background-attachment:scroll;
bgpy
background-position-y: ;
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
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;
c:r
color:rgb( 0 ,
c:ra
color:rgba( 0 ,
cnt:n, ct:n
content:normal;
cnt:oq, ct:oq
content:open-quote;
cnt:cq, ct:cq
content:close-quote;
cnt:ncq, ct:ncq
cnt:c, ct:c
content:counter( );
cnt:cs, ct:cs
content:counters( );
q
Color c
color:# 000 ;
op
opacity: ;
0 ,
0 );
0 ,
0 , . 5 );
Generated content cnt cnt:noq, ct:noq
content:' '; content:no-open-quote;
cnt:a, ct:a
content:attr( );
ct
content: ;
q:ru
quotes:'\00AB' '\00BB' '\201E' '\201C';
cor
counter-reset: ;
content:no-close-quote;
quotes: ;
q:n
quotes:none;
q:en
quotes:'\201C' '\201D' '\2018' '\2019';
coi
counter-increment: ;
ol:n
outline:none;
olo
outline-offset: ;
ols
outline-style: ;
olc
outline-color:# 000 ;
table-layout:auto;
tbl:f
table-layout:fixed;
cps:b
caption-side:bottom;
ec:h
empty-cells:hide;
bd:n
border:none;
bdbk
border-break: close ;
bdcl:c
border-collapse:collapse;
Outline ol
outline: ;
olw
outline-width: ;
olc:i
outline-color:invert;
Tables tbl
table-layout: ;
tbl:a
cps
caption-side: ;
cps:t
caption-side:top;
ec
empty-cells: ;
ec:s
empty-cells:show;
bd+
border: 1px
Border bd
bdbk:c
border: ;
border-break:close;
bdcl
solid
border-collapse: ;
#000 ;
bdcl:s
bdi:n
border-image:none;
bdri
border-right-image:url( );
bdbi:n
border-bottom-image:none;
bdci
bdc
border-collapse:separate;
border-corner-image:url( );
bdtli bdtri bdbri
border-bottom-right-image:url( );
bdbli
border-bottom-left-image:url( );
bdf
border-fit: repeat ;
border-color:# 000 ;
bdc:t
border-color:transparent;
bdi
border-image:url( );
bdti
border-top-image:url( );
bdti:n
border-top-image:none;
bdri:n
border-right-image:none;
bdbi
border-bottom-image:url( );
bdli
border-left-image:url( );
bdli:n
border-left-image:none;
border-corner-image:none;
bdci:c
border-corner-image:continue;
bdtli:c
border-top-left-image:continue;
bdtri:c
border-top-right-image:continue;
bdci:n
border-top-left-image:url( );
bdtli:n
border-top-left-image:none;
border-top-right-image:url( );
bdtri:n
border-top-right-image:none;
bdbri:n
border-bottom-right-image:none;
bdbri:c
border-bottom-right-image:continue;
bdbli:n
border-bottom-left-image:none;
bdbli:c
border-bottom-left-image:continue;
bdf:c
border-fit:clip;
bdf:r
border-fit:repeat;
bdf:sc
border-fit:scale;
bdf:st
border-fit:stretch;
bdf:of
border-fit:overflow;
bdf:sp
border-fit:space;
bdf:ow
border-fit:overwrite;
bdlen
border-length: ;
bdlen:a
border-length:auto;
bdsp
border-spacing: ;
bds
border-style: ;
bds:n
border-style:none;
bds:h
border-style:hidden;
bds:dt
border-style:dotted;
bds:ds
border-style:dashed;
bds:s
border-style:solid;
bds:db
border-style:double;
bds:dtds
border-style:dot-dash;
bds:w bds:i bdt, bt
bdts
border-style:wave;
bds:g
border-style:inset;
bds:o
border-top: ;
border-top-style: ;
bdtc:t
border-top-color:transparent;
bdr:n
border-right:none;
bdrst:n
border-right-style:none;
bdb+
border-bottom: 1px
bdt+
bdts:n
solid
#000 ;
border-bottom-color:# 000 ;
border-style:groove; border-style:outset; border-top: 1px
solid
bdrw
border-right-width: ;
bdrc
border-right-color:# 000 ;
bdbc:t bdl+
#000 ;
border-top-style:none; border-right: ;
bdb:n
bdr, br
bdbs bdbc
border-bottom:none;
border-bottom-style: ; border-bottom-color:transparent; border-left: 1px
solid
#000 ;
bds:dtdtds
border-style:dot-dot-dash;
bds:r
border-style:ridge;
bdw
border-width: ;
bdt:n
border-top:none;
bdtw
border-top-width: ;
bdtc
border-top-color:# 000 ;
bdr+
border-right: 1px
bdrst
border-right-style: ;
bdrc:t
border-right-color:transparent;
bdb, bb
border-bottom: ;
bdbw
border-bottom-width: ;
bdbs:n
border-bottom-style:none;
bdl, bl
border-left: ;
bdl:n
border-left:none;
solid
#000 ;
bdlw
border-left-width: ;
bdlc
border-left-color:# 000 ;
bdbrrs
border-bottom-right-radius: ;
bdls
border-left-style: ;
bdlc:t
border-left-color:transparent;
bdtrrs
border-top-right-radius: ;
bdblrs
border-bottom-left-radius: ;
lis:n
list-style:none;
bdls:n
border-left-style:none;
bdrs
border-radius: ;
bdtlrs
border-top-left-radius: ;
Lists lis lisp:i
list-style: ;
list-style-position:inside;
list:n
list-style-type:none;
list:s
list-style-type:square;
list:lr
list-style-type:lower-roman;
lisi:n
list-style-image:none;
lisp:o
list-style-position:outside;
lisp
list-style-position: ;
list
list-style-type: ;
list:c
list-style-type:circle;
list:dclz
list-style-type:decimal-leading-zero;
lisi
list-style-image: ;
list:d
list-style-type:disc;
list:dc
list-style-type:decimal;
list:ur
list-style-type:upper-roman;
pgbb:au
page-break-before:auto;
pgbb:al
page-break-before:always;
Print pgbb
page-break-before: ;
pgbb:l
page-break-before:left;
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: ;
!important
@f
@font-face { font-family: ; src:url(|); }
@f+
@font-face {
Others !
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:
font-weight:
} @i, @import
@import url( );
normal ; normal ;
@kf
@-webkit-keyframes from { to {
@m, @media
identifier {
@media
screen {
} }
}
anim
animation: ;
anim-
animation: name
} @-o-keyframes
identifier {
from { to {
duration
timing-function
delay
iteration-count
direction
fill-mode ;
} }
animdel
animation-delay: time ;
animdir:a
animation-direction:alternate;
animdir:n
animation-direction:normal;
animdur
animation-duration: 0 s;
animdir
animation-direction: normal ;
animdir:ar
animation-direction:alternate-reverse;
animdir:r
animation-direction:reverse;
animfm
animation-fill-mode: both ;
} @-moz-keyframes from { to {
identifier { }
identifier {
from { to {
animfm:b
} }
}
animps
}
} @keyframes
animation-play-state: running ;
animfm:bt, animfm:bh
animation-fill-mode:backwards;
animfm:f
animation-fill-mode:forwards;
animic:i
animation-iteration-count:infinite;
animps:p
animation-play-state:paused;
animtf
animation-timing-function:
linear ;
animation-fill-mode:both;
animic
animation-iteration-count:
animn
animation-name: none ;
animps:r
animation-play-state:running;
animtf:cb
animation-timing-function:cubic-bezier( 0.1 ,
animtf:e
animation-timing-function:ease;
animtf:eo
animation-timing-function:ease-out;
bg:ie
filter:progid:DXImageTransform.Microsof t.AlphaImageLoader(src='
animtf:ei
x
.png',sizingMethod=' crop ');
colm
columns: ;
colmc
column-count: ;
colmf
column-fill: ;
colmg
column-gap: ;
colmr
column-rule: ;
colmrs
column-rule-style: ;
colmrw
column-rule-width: ;
colmw
column-width: ;
mar
max-resolution: res ;
op:ie
filter:progid:DXImageTransform.Microsof t.Alpha(Opacity=100);
op:ms
-msfilter:'progid:DXImageTransform.Microso ft.Alpha(Opacity=100)';
ori:l
orientation:landscape;
ori:p
orientation:portrait;
tov:c
text-overflow:clip;
tov:e
text-overflow:ellipsis;
trf:r
transform: rotate( angle );
trf:sc
transform: scale( x ,
trf:scy
transform: scaleY( y );
trf:skx
transform: skewX( angle );
transform: translate( x ,
trf:tx
transform: translateX( x );
trfs
transform-style: preserve-3d ;
min-resolution: res ;
ori
orientation: ;
tov
text-overflow:${ellipsis};
trf
transform: ;
trf:scx
transform: scaleX( x );
trf:sky
transform: skewY( angle );
trf:t
transform: translateY( y );
trfo
appearance:${none};
${child} */
mir
animation-timing-function:ease-in-out;
ap
/*
column-span: ;
0.1 );
animation-timing-function:linear;
colms
1.0 ,
cm
column-rule-color: ;
animation-timing-function:ease-in;
0.7 ,
animtf:eio
animtf:l
colmrc
trf:ty
1 ;
transform-origin: ;
y );
y );
You're Reading a Preview Unlock full access with a free trial.
Download With Free Trial
You're Reading a Preview Unlock full access with a free trial.
Download With Free Trial
View more...
Comments
