What Is an HTML Block?

A HyperText Markup Language (HTML) block, in a broad sense, is a segment of HTML code that relates to a defined area of the finished document when it is displayed by a program such as a web browser. The importance of an HTML block is seen when assigning different attributes to elements, because many styles and other definitions can only be assigned to block-level elements. The opposite of an HTML block is inline code, which must always be nested inside a block to function.

One example of the definition of an HTML block is a paragraph of text on a website. When the page is being viewed inside a web browser, the paragraph appears with a blank line between it and the previous paragraph and with a blank line after the paragraph and the next display element. Within the HTML code for the page, the paragraph is surrounded by HTML tags that define it as being a paragraph block. These tags that surround the paragraph establish everything between them as an HTML block.

An HTML block can be nested inside another block. In fact, almost all tags are really nested inside the body tags that are required by an HTML document. Conversely, an inline segment needs to be nested inside a block because it requires elements that they contain if it is to operate. An example of an inline tag is a piece of text that needs to be displayed in bold.

The difference between an HTML block-level element and an inline element is one of the key pieces of understanding required to work with HTML and Cascading Style Sheets (CSS). This is primarily because there are certain standard style attributes and other parameters that are described as applying only to block-level elements, or only to inline-level elements. In general, inline elements do not contain the same changeable attributes as block-level elements.

An example of the difference between an HTML block-level attribute and an inline-level attribute is the alignment option. At the block level, such as a division tag or the start of a bulleted list, the text or images within the block can be set to snap to the left, right or center of an area. If the alignment attribute is applied to an inline element, then nothing will happen, because it is not an available option at the inline level.