开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第十四天，点击查看活动详情

💕 前言：今日继续CSS 3的新特性学习，掌握CSS 3盒子模型、其他特性以及CSS 3过渡~

CSS3是CSS（层叠样式表）技术的升级版本，于1999年开始制订，2001年5月23日W3C完成了CSS3的工作草案，主要包括盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多栏布局等模块。

CSS演进的一个主要变化就是W3C决定将CSS3分成一系列模块。浏览器厂商按CSS节奏快速创新，因此通过采用模块方法，CSS3规范里的元素能以不同速度向前发展，因为不同的浏览器厂商只支持给定特性。但不同浏览器在不同时间支持不同特性，这也让跨浏览器开发变得复杂。

4. CSS3 盒子模型

CSS3中可以通过 box-sizing来指定盒模型，有2个值∶即可指定为content-box、border-box，这样我们计算盒子大小的方式就发生了改变。

可以分成两种情况︰

如果盒子模型我们改为了box-sizing: border-box ，那padding和border就不会撑大盒子了(前提padding和border不会超过width宽度)

filter CSS属性将模糊或颜色偏移等图形效果应用于元素。

filter: 函数();

例如: filter: blur(5px); blur模糊处理数值越大越模糊

calc 函数：

calc() 此CSS函数让你在声明CSS属性值时执行一些计算。

width: calc(100% - 80px);

括号里面可以使用+ - * /来进行计算。

transition: 要过渡的属性1 花费时间 运动曲线 何时开始，要过渡的属性2 花费时间 运动曲线 何时开始;/*多种属性变化用逗号隔开，也可以用all*/