Retour en haut
Les principaux raccourcis
Emmet est un outil de développement web qui vous fera gagner beaucoup de temps ! En quelques caractères seulement, vous pourrez écrire plusieurs dizaines
de lignes de code, bref un véritable atout dans votre travail quotidien. Encore faut-il connaître les principaux raccourcis,
voici ceux qui me semblent fondamentaux
Syntaxe
nav>ul>li
création des éléments enfants
div+p+bq
crée des éléments parents
div+div>p>span+em^^bq
insère le blockquote après la div
(div>dl>(dt+dd)*3)+footer>p
groupement pour calcul
Numération
ul>li*5
multiplication de l'élément li
ul>li.item$*5
numération d'une classe item de 1 à 5
h$[title=item$]{Header $}*3
titre de h1 à h3 avec titre de 1 à 3
ul>li.item$$$*5
numérotation classe item de 001 à 005
ul>li.item$@-*5
numérotation décroissante
ul>li.item$@3*5
numérotation à partir de 3
Tags et attributs
#header
div id header
.title
div classe title
p.class1.class2.class3
paragraphe avec 3 classes
.class
div avec classe
ul>.class
liste avec classe sur li
a{Click me}
lien avec texte
Raccourcis html
a:link
lien complet
a:mail
lien vers mail
img
balise image complète
sect
balise section
hdr/nav/fig
balises structurantes
btn
button
ul+ / table+
liste ou table
Raccourcis css
pos / pos : s a r f
différents positionnements
t/r/b/l : a
top, right, bottom, left : auto
fl : r/l
float left/right
m / m : a
margin / margin auto
mt/mr/mb/ml
différentes margin
pt/pr/pb/pl
différents paddings
f
font :
bd+
border : 1px solid #000
bg+
background : #fff url () 0 0 no-repeat
