padding:10px; 为什么盒子变大了?
盒子的宽度=内容宽+内边距(padding)+边框(border),内容宽就是自己定义的width,内边距是在内容外边,边框里边的填充,加了padding,盒子的实际宽度就变大了,高度也是同样原理
盒子由四部分组成,分别是内容、内边距、边框和外边距,其中会算到盒子宽度和高度的是内容、内边距和边框,也就是说内容、内边距和边框的大小变化时,盒子的大小会变
盒宽大小包括边框宽、内边距、内容宽,在其他不变得情况下,内边距变大,盒子本身就变大了
月饼大小不变,但是月饼与月饼盒之间的距离增加了10px,盒子当然要变大了
不设置padding的时候 不光字是div内容 字外面的白色区域也是div的内容区域 padding:10px的时候 字和之前的白色区域不变 div边框向外扩大10px