标准盒子:width即设置内容区域宽度,不包括内边距、边框、外边距;
怪异盒子:width包括内容区域、内边距和边框,不包括外边距
标准盒子设置方式:box-sizing:content-box;
怪异盒子设置方式:box-sizing:border-box;
设置原因:标准盒子的宽高设置后会因为padding而被撑开,导致内容移动,怪异盒子则会固定
设置width='200px’时:
标准盒子:
怪异盒子:
标准盒子:width即设置内容区域宽度,不包括内边距、边框、外边距;
怪异盒子:width包括内容区域、内边距和边框,不包括外边距
标准盒子设置方式:box-sizing:content-box;
怪异盒子设置方式:box-sizing:border-box;
设置原因:标准盒子的宽高设置后会因为padding而被撑开,导致内容移动,怪异盒子则会固定
设置width='200px’时:
标准盒子:
怪异盒子: