Box Model

The CSS box model describes the rectangular boxes generated for elements in the DOM. The box model is composed of the following layers:

1. Content: The innermost part, where text and images appear.
2. Padding: The space between the content and the border.
3. Border: The outer edge of the padding, surrounding the element.
4. Margin: The space outside the border, separating the element from others.

By controlling each layer individually, you can define the look of each element in the user interface.