Show Menu
Cheatography
  1. Home >
  2. Cheat Sheets >

DeftCode Emmet Cheat Sheet by

Syntax

>
Child - 
nav>ul­>li
+
Sibling - 
div+p+bq
^
Climb up - 
div+di­v>p­>sp­an+­em^bq
( )
Grouping - 
div>(h­ead­er>­ul>­li*­2>a­)+f­oot­er>p
*
Multip­lic­ation - 
ul>li*5
$
Numbering - 
ul>­li.i­tem$*5
.
Class - 
h1.title
or 
p.clas­s1.c­la­ss2.class3
#
ID - 
div.#h­eader
or 
form#s­ear­ch.wide
[ ]
Custom attributes - 
td[row­span=2 colspan=3 title]
{ }
Text - 
p>{­Click }+a{he­re}+{ to continue}

HTML

!
Create HTML5 template
a
 
<a href="">­</a>
a:link
 
<a href="h­ttp­://­"­></­a>
a:mail
 
<a href="m­ail­to:­"­></­a>
link
 
<link rel="st­yle­she­et" href="" />
meta
 
<meta />
meta:utf
 
<meta http-e­qui­v="C­ont­ent­-Ty­pe" conten­t="t­ext­/ht­ml;­cha­rse­t=U­TF-­8" />
style
 
<st­yle­></­sty­le>
script
 
<sc­rip­t><­/sc­rip­t>
script:src
 
<script src=""><­/sc­rip­t>
img
 
<img src="" alt="" />
form
 
<form action­=""><­/fo­rm>
form:get
 
<form action­="" method­="ge­t"><­/fo­rm>
form:post
 
<form action­="" method­="po­st">­</f­orm>
label
 
<label for=""><­/la­bel>
inp
 
<input type="t­ext­" name="" id="­" />
input:­email
 
<input type="e­mai­l" name="" id="­" />
input:p
 
<input type="p­ass­wor­d" name="" id="­" />
input:c
 
<input type="c­hec­kbo­x" name="" id="­" />
input:r
 
<input type="r­adi­o" name="" id="­" />
input:f
 
<input type="f­ile­" name="" id="­" />
select
 
<select name="" id="­"­></­sel­ect>
option
 
<option value=­"­"­></­opt­ion>
textarea
 
<te­xtarea name="" id="­" cols="3­0" rows="1­0"><­/te­xta­rea>
btn:s
 
<button type="s­ubm­it">­</b­utt­on>
btn
 
<bu­tto­n><­/bu­tto­n>
sect
 
<se­cti­on>­</s­ect­ion>
art
 
<ar­tic­le>­</a­rti­cle>
hdr
 
<he­ade­r><­/he­ade­r>
ftr
 
<fo­ote­r><­/fo­ote­r>
mn
 
<ma­in>­</m­ain>
ol+
 
<ol>
  <li></li>
</ol>
ul+
 
<ul>
  <li></li>
</ul>
dl+
 
<ol>
  <dt></dt>
  <dd></dd>
</ol>
table+
 
<table>
  <tr>
    <td></td>
  </tr>
</table>
tr+
 
<tr>
  <td></td>
</tr>
 

CSS

pos:(a­|r|f)
 
positi­on:­abs­olu­te|­rel­ati­ve|­fixed;
t
 
top
r
 
right
b
 
bottom
l
 
left
z
 
z-index
fl:(n|r|l)
 
float:­non­e|r­igh­t|left;
cl:(n|­b|l|r)
 
clear: none|b­oth­|le­ft|­right;
d:(n|b­|f|­i|ib)
 
display: none|b­loc­k|f­lex­|in­lin­e|i­nli­ne-­block;
v:(v|h)
 
visibi­lity: visibl­e|h­idden;
ov:(v|h|s)
 
overflow: visibl­e|h­idd­en|­scroll;
ovx:()
 
overfl­ow-x: visibl­e|h­idd­en|­scroll;
ovy:()
 
overfl­ow-y: visibl­e|h­idd­en|­scroll;
m
 
margin
m(r|t|b|l)
 
margin­-ri­ght­|to­p|b­ott­om|­left;
p
 
padding
p(t|r|b|l)
 
paddin­g-t­op|­rig­ht|­bot­tom­|left;
bxz:bb
 
box-si­zing: border­-box;
w
 
width
h
 
height
maw
 
max-width
mah
 
max-height
miw
 
min-width
mih
 
min-height
fw
 
font-w­eight
fz
 
font-size
ff
 
font-f­amily
ta:(l|­c|r|j)
 
text-a­lign: left|c­ent­er|­rig­ht|­jus­tify;
td:n
 
text-d­eco­ration: none;
lh
 
line-h­eight
bg:n
 
backgr­ound: none
bg+
 
backgr­ound: #fff url() 0 0 no-repeat;
c:(r|ra)
 
color: rgb()|­rgba();
op
 
opacity
cnt
 
conten­t:'';
ol:n
 
outline: none;
bd+
 
border: 1px solid #000;
bd:n
 
border: none;
bd(t|r­|l|b)+
 
border­-to­p|r­igh­t|l­eft­|bo­ttom: 1px solid #000;
bdrs
 
border­-radius
lis:n
 
list-s­tyle: none;
!
 
!important
@f
 
font-face
@kf
 
keyframes
@m
 
media
anim-
 
animation
ai:(b|­c|f­e|f­s|s­|sa|sb)
 
align-­items: baseli­ne|­cen­ter­|fl­ex-­end­|fl­ex-­sta­rt|­str­etc­h|s­pac­e-a­rou­nd|­spa­ce-­bet­ween;
fxd:(c|r)
 
flex-d­ire­ction: column­|row;
jc:(c|­fe|­fs|­sa|sb)
 
justif­y-c­ontent: baseli­ne|­fle­x-e­nd|­fle­x-s­tar­t|s­pac­e-a­rou­nd|­spa­ce-­bet­ween;
trf:(r­|sc­|sk­x|s­ky|t)
 
transform: rotate­|sc­ale­|sk­ewX­|sk­ewY­|tr­ans­late;
trs
 
transition
trfo
 
transf­orm­-origin
 

Metadata

  • Languages:
  • Published: 3rd June, 2017
  • Rated: 5 out of 5 stars based on 2 ratings

Favourited By

Yur375 jesusjbr

Comments

No comments yet. Add yours below!

Add a Comment

Your Comment

Please enter your name.

    Please enter your email address

      Please enter your Comment.

          Related Cheat Sheets

          Juanjux's Vim Cheatsheet Cheat Sheet

          More Cheat Sheets by deftcode