自学前端day05-css布局（笔记整理）

课程自学：（b站）黑马程序员【前端HTML5+CSS3+移动Web全套教程】

 

 

 

 就

 举例：设置一个宽高都是400px的盒子，边框为10px

 结果：盒子实际宽高都为420px

因为width和height默认设置为内容区域（content）的大小，设置边框10px，实质上是在400px基础上再加左右边框各10px，一共400+10+10=420px

如下图，浏览器中检查可见

 此是需将width和height手动内减为380px，再加边框20px，可得宽高为400px的盒子

 也可以设置box-sizing:borer-box自动内减，此时的width和height就是盒子的，而非盒子内容的

更改后