HTML documents include text, images, multimedia files, links, and other bits of content that you mold into a web page by using markup elements and attributes. You use blocks of text to create such things as headings, paragraphs, and lists. The first step in creating a solid HTML document is laying a firm foundation to establish the document’s structure.
Here’s an ultratechnical definition of a block of text: some chunk of content that fills one or more lines inside an HTML element.
In fact, any HTML page is a collection of blocks of text:
Every bit of content on your page must be part of some block element.
Block elements usually end with a line break when rendered in a web browser.
Every block element sits inside the element on your page. In fact, is the ultimate block!
The difference between inline elements and a block of text is important. An inline element is a word or string of words inside a block element (for example, text-emphasis elements, such as or ). Inline elements must be nested within a block element; otherwise, your HTML document isn’t syntactically correct.
Inline elements, such as linking and formatting elements, are designed to link from (or change the appearance of) a few words or lines of content found inside those blocks.
HTML recognizes several kinds of text blocks that you can use in your document, including (but not limited to) the items shown in this table.
Element | Description | Element | Description |
---|---|---|---|
article | Article content | header | Section or page header |
aside | Aside content | h1–h6 | Heading levels 1–6 |
blockquote | Block quotation | hr* | Horizontal rule |
body | Page body | p | Paragraph |
br1 | Line break | pre | Preformatted text |
div | Division in web page | section | Section in web page |
figure | Groups image and caption | table, and so on2 | HTML tables |
footer | Section or page footer | ul, ol, dl | Lists by type |
1 Denotes an empty element (single tag only, no pair).
2 All table elements fall into this cell.
For more about HTML block elements, visit the Tutorial Chip website: “HTML5 Block Level Elements: Complete List.”