https://github.com/lifeparticle/HTML-Cheatsheet

HTML-Cheatsheet
https://github.com/lifeparticle/HTML-Cheatsheet

List: HTML-Cheatsheet

awesome awesome-list front-end-development frontend html html5 webapp website

Last synced: 3 months ago
JSON representation

HTML-Cheatsheet

• Host: GitHub
• URL: https://github.com/lifeparticle/HTML-Cheatsheet
• Owner: lifeparticle
• License: mit
• Created: 2023-01-12T05:44:12.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2023-12-10T09:52:38.000Z (about 1 year ago)
• Last Synced: 2024-10-26T10:39:26.317Z (3 months ago)
• Topics: awesome, awesome-list, front-end-development, frontend, html, html5, webapp, website
• Language: HTML
• Homepage: https://html-elements.netlify.app
• Size: 7.81 KB
• Stars: 4
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Elements

There are six different kinds of elements:

1. Void elements

`area, base, br, col, embed, hr, img, input, link, meta, source, track, wbr`

2. The template element

`template`

3. Raw text elements

`script, style`

4. Escapable raw text elements

`textarea, title`

5. Foreign elements

MathML, SVG.

6. Normal elements

Rest of the HTML elements.

# block-level elements

- A Block-level element occupy the full width of their parent container by default.

- A Block-level elements has a new line, both before and after the element.

- Block-level elements are like stack of boxes.

`
`, ``, ``, `
`, ``, `
`, `
`, `
`, `
`, ``, ``, ``, ``, ``, `
`, `
`, `
`, `
`, `
`, `
`, ``, `
`, `
`, ``, ``, ``, `
`, ``, `
`, `

`, ``, ``, ``, `
`, ``


# inline elements

- An Inline element do not occupy the full width of their parent container by default.

- An Inline element do not start on a new line.

- An Inline element do not respect top and bottom margins & paddings.

- Inline elements can be place side by side.

``, ``, ``, ``, ``, ``, `
`, ``, ``, ``, ``, ``, ``, ``, ``, ``, ``, ``, ``, ``, ``, ``, ``, `<select>`, `<small>`, `<span>`, `<strong>`, `<sub>`, `<sup>`, `<textarea>`, `<time>`, `<tt>`, `<var>`


# inline-block

- `display: inline-block` elements respect top and bottom margins & paddings.

# Others

- `<search>`: The generic search element

- `<dialog>`: The Dialog element

# Resources

1. https://html.spec.whatwg.org/