<aside> 💡 CSS3在CSS2基础上,增强新增了许多特性, 弥补了CSS2的众多不足之处,使得Web开发变得更为高效和便捷。****

</aside>

文本

text-shadow:设置文本的阴影

text-shadow: 20px 27px 22px pink;

Untitled

盒模型中的 box-sizing 属性

CSS3 对盒模型做出了新的定义,即允许开发人员指定盒子宽度和高度的计算方式

这就需要用到 box-sizing属性。它的属性值可以是:content-boxborder-box。解释如下。

外加模式:(css的默认方式)

box-sizing: content-box;

解释:此时设置的 width 和 height 是内容区域的宽高。盒子的实际宽度 = 设置的 width + padding + border。此时改变 padding 和 border 的大小,也不会改变内容的宽高,而是盒子的总宽高发生变化。

内减模式:【需要注意】

box-sizing: border-box;

解释:此时设置的 width 和 height 是盒子的总宽高。盒子的实际宽度 = 设置的 width。此时改变 padding 和 border 的大小,会改变内容的宽高,盒子的总宽高不变。

边框