Standard Boxes and Weird Boxes

standard box

box-sizing:context-box;

The size of the standard box itself=content+border+padding

The size of the standard box in the page = content+border+padding+margin

Adding border, border, and margin to a standard box will open the box

weird box

box-sizing:border-box;

The size of the weird box itself = content (including padding, border)

The size of the weird box on the page = content (including border, padding) + margin

Adding border and padding to the weird box will not open the box, but will only reduce the size of the content

Guess you like

Origin blog.csdn.net/weixin_68915174/article/details/128614350