<!-- @format -->

# 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

Emmet are nice shortcuts for HTML integrated in VSCod{e,ium}, just type them
and press enter/return and code appears!

### 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

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!

- https://github.com/emmetio/emmet/blob/v2.4.6/src/snippets/css.json