What is Box model ? | HTML - CSS

A box in CSS/HTML consists of a content area, which is where any text, images, or other HTML elements are displayed.
This is optionally surrounded by padding, a border, and a margin, on one or more sides.
The box model describes how these elements work together to create a box as displayed by CSS .

In short, it is a box that wraps around every HTML element .

It consists of: margins, borders, padding, and the actual content.
Sample 1 :

Sample 2: