The display property in CSS determines how an element is rendered in the document flow. Each HTML element has a default display value that defines its initial rendering behavior.
Default Value
The default value of the display property varies for different HTML elements. However, most elements have a default display value of block, inline, or inline-block.
Table of Content
Block-level Elements
-
Example:
<div>,<p> Elements. -
Default:
block - Characteristics: Takes up the full width available, starts on a new line, and stacks vertically.
Inline Elements
-
Example:
<span>,<a>Elements. -
Default:
inline - Characteristics: Occupies only as much width as necessary, does not start on a new line, and allows other elements to appear on the same line.
Inline-Block Elements
-
Example:
<img>,<button>Elements. -
Default:
inline-block - Characteristics: Behaves like an inline element but allows block-level properties like width and height.