semantic elements

1These are some of the roughly 100 semantic elements available:
2
3<article>
4<aside>
5<details>
6<figcaption>
7<figure>
8<footer>
9<header>
10<main>
11<mark>
12<nav>
13<section>
14<summary>
15<time>

1<article> 	Defines independent, self-contained content
2<aside> 	Defines content aside from the page content
3<details> 	Defines additional details that the user can view or hide
4<figcaption> 	Defines a caption for a <figure> element
5<figure> 	Specifies self-contained content, like illustrations, diagrams, photos, code listings, etc.
6<footer> 	Defines a footer for a document or section
7<header> 	Specifies a header for a document or section
8<main> 	Specifies the main content of a document
9<mark> 	Defines marked/highlighted text
10<nav> 	Defines navigation links
11<section> 	Defines a section in a document
12<summary> 	Defines a visible heading for a <details> element
13<time> 	Defines a date/time

1HTML has both non-semantic and semantic elements.
2"Semantic" in HTML terms just means more specific
3
4<div> and <span> are not semantic because they tell you nothing about their
5contents, however, elements such as <article>, <figure>, <footer>, etc. are
6semantic because they tell you exactly what they contain.

1<article>
2<aside>
3<details>
4<figcaption>
5<figure>
6<footer>
7<header>
8<main>
9<mark>
10<nav>
11<section>
12<summary>
13<time>

1<div></div>
2    <span></span>
3    <hr> <!-- horizontal rule is a divider -->
4    <br> <!-- break make a break line -->
5    <sup></sup> <!-- superscript add a notation (upp) -->
6    <sub></sub> <!-- subscript add a notation (down) -->
7    &lt; <!-- &; is used to print special or reserved character 
8    &lt; = “<” and &gt; = “>” -->