Similar to how your text editor provides <h1> to <h6> headings, along with a plethora of ways to format sections of text
in meaningful and visual ways, HTML provides a very similar set of semantic and non-semantic elements to make meaning of prose.
This section covers the main ways of marking up text, or text basics. We will then discuss attributes, before exploring additional ways of marking up text, such as lists, tables, and forms.
Headings, revisited
There are six section heading elements, <h1>, <h2>, <h3>, <h4>, <h5>, and <h6>, with <h1> being most important
and <h6> the least. For many years, developers were told that headings were used by browsers to outline documents.
That was originally a goal, but browsers never implemented document outlining features, and the proposed outline algorithm was officially removed from the HTML specification. However, screen reader users do rely heavily on headings
as an exploration strategy to learn about the content of a page, navigating through headings with the h key. Ensuring
that heading levels are implemented logically—as you would outline a document—makes your content accessible and is strongly recommended.
By default, browsers style <h1> the largest, <h2> slightly smaller, with each subsequent heading level being smaller
by default. Historically, user agent stylesheets also decremented the font size of <h1> elements nested inside sectioning elements such as <article>, <aside>, <nav>, or <section>.
Some user agent stylesheets included the following selectors (or similar) to style nested <h1> elements as if they were lower heading levels:
/* Legacy UA stylesheet behavior (now removed from browsers and the HTML spec) */
h2, :is(article, aside, nav, section) h1 {}
h3, :is(article, aside, nav, section) :is(article, aside