How to understand the box model

Each HTML element is a box, and this box may be wrapped in other boxes. This is the box model.

The box model is divided into [standard box model] and [IE box model]

• Standard box model:
  • Margin + border + padding + content (width and height);
• IE box model:
  • Margin + content (width and height + padding + border);
• How to set up the box model:
  • Box-sizing:content-box sets the default label box model;
  • Box-sizing:border-box sets the IE box model;