Box-sizing attribute application, box-sizing Application

Box-sizing attribute application, box-sizing Application

1. box-sizing attribute function

Official documentation: http://www.w3school.com.cn/cssref/pr_box-sizing.asp

The box-sizing attribute allows you to define specific elements that match a region in a specific way.

In general: defines the size of the box model.

The box-sizing attribute has three values:

box-sizing: content-box|border-box|inherit;

 

2. This article focuses on border-box values.

The padding and border of the box model ).

Sample Code:

<! DOCTYPE html> 
F12 review elements:

 
 
Box-sizing: border-box;Mobile TerminalThere are many applications!
InAlso applied in the bootstrap frameworkThe default box model of all elements is box-sizing: border-box ;:

3. Compatibility
Http://caniuse.com/#search=box-sizing

 
Compatible with mainstream browsers over IE8!