2024-06-19 07:53:27 +02:00
|
|
|
<!-- @format -->
|
|
|
|
|
|
2024-06-12 08:14:30 +02:00
|
|
|
# HTML & CSS tricks for future reference
|
|
|
|
|
|
|
|
|
|
<!-- editorconfig-checker-disable -->
|
|
|
|
|
<!-- prettier-ignore-start -->
|
|
|
|
|
|
|
|
|
|
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
|
|
|
|
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
|
|
|
|
|
|
|
|
|
- [Emmet](#emmet)
|
|
|
|
|
- [html](#html)
|
|
|
|
|
- [css](#css)
|
|
|
|
|
|
|
|
|
|
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
|
|
|
|
|
|
|
|
|
<!-- prettier-ignore-end -->
|
|
|
|
|
<!-- editorconfig-checker-enable -->
|
|
|
|
|
|
|
|
|
|
## Emmet
|
|
|
|
|
|
2024-06-19 07:53:27 +02:00
|
|
|
Emmet are nice shortcuts for HTML integrated in VSCod{e,ium}, just type them
|
|
|
|
|
and press enter/return and code appears!
|
2024-06-12 08:14:30 +02:00
|
|
|
|
|
|
|
|
### html
|
|
|
|
|
|
|
|
|
|
- https://docs.emmet.io/abbreviations/
|
|
|
|
|
- https://github.com/emmetio/emmet/tree/v2.4.6/src/snippets
|
|
|
|
|
- ! - boilerplate html with head, body and all
|
|
|
|
|
- link:css - stylesheet link
|
|
|
|
|
- h1 - header 1
|
|
|
|
|
- p - paragraph tags
|
|
|
|
|
- code - code block
|
|
|
|
|
- pre - preformatted code
|
|
|
|
|
- lorem10 - or other number generates that much of Lorem Ipsum
|
|
|
|
|
- ul - generates an unordered list
|
|
|
|
|
- li\*4 - generates 4 list items
|
|
|
|
|
- hr - the horizontal line
|
|
|
|
|
- br - linebreak
|
|
|
|
|
|
|
|
|
|
### css
|
|
|
|
|
|
2024-06-19 07:53:27 +02:00
|
|
|
At the time of writing I didn't get anything that useful out of Emmet CSS so
|
|
|
|
|
the `style.css` is work of prior copy-pasting to become where I copy-paste
|
|
|
|
|
from!
|
2024-06-12 08:14:30 +02:00
|
|
|
|
|
|
|
|
- https://github.com/emmetio/emmet/blob/v2.4.6/src/snippets/css.json
|
