diff --git a/tools/emmet.md b/tools/emmet.md index c38731d..74b4977 100644 --- a/tools/emmet.md +++ b/tools/emmet.md @@ -16,7 +16,7 @@ __This cheatsheet will assume that you press `Tab` after each expressions.__ ## Basics -### Generating HTML 5 Snippet +### Generating HTML 5 DOCTYPE `html:5` Will generate @@ -144,3 +144,74 @@ Attributes can be added using `[]` ```HTML ``` + +### Numbering +Numbering can be done using `$` +You can use this inside tag or contents. + +`h${This is so awesome $}*6` + +```HTML +

This is so awesome 1

+

This is so awesome 2

+

This is so awesome 3

+

This is so awesome 4

+
This is so awesome 5
+
This is so awesome 6
+``` + +Use `@-` to reverse the Numbering + +`img[src=image$$@-.jpg]*5` + +```HTML + + + + + +``` + +To start the numbering from specific number, use this way + +`img[src=emmet$@100.jpg]*5` + +```HTML + + + + + +``` + +## Tips +* Use `:` to expand known abbreviations + +`input:date` +```HTML + +``` + +`form:post` +```HTML +
+``` + +`link:css` +```html + +``` + +* Building Navbar + +`.navbar>ul>li*3>a[href=#]{Item $@-}` + +```HTML + +```