Docsity
Docsity

Prepare for your exams
Prepare for your exams

Study with the several resources on Docsity


Earn points to download
Earn points to download

Earn points by helping other students or get them with a premium plan


Guidelines and tips
Guidelines and tips

Emmet Cheat Sheet: A Comprehensive Guide to Efficient HTML and CSS Coding, Cheat Sheet of Programming Languages

Cheat sheet on the most popula text editor - Emmet

Typology: Cheat Sheet

2019/2020

Uploaded on 10/09/2020

stagist
stagist 🇺🇸

4.1

(27)

265 documents

1 / 24

Toggle sidebar

This page cannot be seen from the preview

Don't miss anything!

bg1
Emmet | Cheat Sheet (2017-03)
Syntax . . . . . . . .1
Child: > . . . . . . . . . . .1
Sibling: + . . . . . . . . . .1
Climb-up: ^ . . . . . . . .1
Grouping: () . . . . . . . .1
Multiplication: * . . . . . .2
Naming and numbering: $ 2
ID and CLASS attributes . .2
Custom attributes . . . . .2
Text: {} . . . . . . . . . . .2
Implicit tag names . . . . .2
HTML . . . . . . . . 3
Form, Input, Button . . . .4
CSS . . . . . . . . . 7
Visual Formatting . . . . .7
Margin & Padding . . . . .9
Box Sizing . . . . . . . . .9
Font . . . . . . . . . . . .9
Text . . . . . . . . . . . . 11
Background . . . . . . . 13
Color . . . . . . . . . . . 14
Generated content . . . .14
Outline . . . . . . . . . . 15
Tables . . . . . . . . . . 15
Border . . . . . . . . . . 15
Lists . . . . . . . . . . . 18
Print . . . . . . . . . . . 18
Others . . . . . . . . . . 18
Animation . . . . . . . . 19
Flex . . . . . . . . . . . .20
Transform, Transition . . 21
XSL . . . . . . . . 22
HTML DOCTYPES . 23
http://docs .emmet .io/
SYNTAX
Child: >
nav>ul>li
<nav>
<ul>
<li></li>
</ul>
</nav>
Sibling: +
div+p+bq
<div></div>
<p></p>
<blockquote></blockquote>
Climb-up: ^
div+div>p>span+em^bq
<div></div>
<div>
<p><span></span><em></em></p>
<blockquote></blockquote>
</div>
div+div>p>span+em^^bq
<div></div>
<div>
<p><span></span><em></em></p>
</div>
<blockquote></blockquote>
Grouping: ()
div>(header>ul>li*2>a)+footer>p
<div>
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</header>
<footer>
<p></p>
</footer>
</div>
(div>dl>(dt+dd)*3)+footer>p
<div>
<dl>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
</dl>
</div>
<footer>
<p></p>
</footer>
1
pf3
pf4
pf5
pf8
pf9
pfa
pfd
pfe
pff
pf12
pf13
pf14
pf15
pf16
pf17
pf18

Partial preview of the text

Download Emmet Cheat Sheet: A Comprehensive Guide to Efficient HTML and CSS Coding and more Cheat Sheet Programming Languages in PDF only on Docsity!

Emmet | Cheat Sheet (2017-03)

Syntax 1

Child: > 1 Sibling: + 1 Climb-up: ^ 1 Grouping: () 1 Multiplication: * 2 Naming and numbering: $ 2 ID and CLASS attributes 2 Custom attributes 2 Text: {} 2 Implicit tag names 2

HTML 3

Form, Input, Button 4

CSS 7

Visual Formatting 7 Margin & Padding 9 Box Sizing 9 Font 9 Text 11 Background 13 Color 14 Generated content 14 Outline 15 Tables 15 Border 15 Lists 18 Print 18 Others 18 Animation 19 Flex 20 Transform, Transition 21

XSL 22

HTML DOCTYPES 23

http://docs emmet io/

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

(div>dl>(dt+dd)*3)+footer>p

ID and CLASS attributes

#header

.title

form#search.wide