乐趣区

关于前端:CSS3-盒子模型

CSS3 中能够通过 box-sizing 来指定盒子模型。

在之前的盒子模型中,如果咱们为盒子设置了 width、padding、border,那么盒子的理论宽度为 width + padding-left + padding-right + border-left + border-right。

在 CSS3 中,如果为盒子设置:

  box-sizing: border-box;

那么 padding 和 border 就不会撑大盒子,咱们设置的 width 就会是盒子的理论宽度。

box-sizing 的值还能够为 content-box,也就是以前默认的会撑大盒子的款式。

退出移动版