什么是CSS数据类型？
引用《CSS新世界》中的介绍：
怎么去理解呢，我们可以去看看官方文档中对于 background-color的描述：
background-color : <color>
上面语法示例中的 <color>就是我们说的CSS数据类型；
掌握CSS数据类型对了解CSS新世界的体系和快速学习CSS新特性非常有帮助！（切记）
为什么要学习CSS数据类型？
在CSS2时代，CSS数据类型的概念并不重要，因为CSS常用的属性翻来覆去就那么几个，这些属性在我们工作中经常用到，久而久之我们也就都记住了。
为了加速没有争议的CSS特性的标准化，W3C的CSS工作组做出了一项被称为“Beijing doctrine”的决定，该决定将CSS划分为更小的组件，并把这些组件成为模块。这些模块互相独立，各自按照自己的速度走向标准化。
如果此时我们还和CSS2那样，只是凭借经验去记忆CSS的属性值，去学习CSS的新特性，那么学习起来肯定是十分痛苦的，因为效率非常低下！
我们无需记住数量繁多的CSS属性值，只需要记住支持的数据类型即可！
学习CSS数据类型有什么用？
background-image是一个非常常用的CSS属性，我们来看看它的语法结构：background-image : <image> | none上面的
<image>就是一个CSS数据类型，它包括下面这些类型和函数：
<gradient>element(image(image-set(cross-fade(paint(
<url>
background-image属性不仅支持url函数和渐变图像，还支持element(等函数！
这么突然疑问，如果你没有用过这个属性，那相比一时半会你也想不出答案，让我们来看看官方文档吧！
mask-image : none | <image> | <mask-source>
这个语法中出现了与background-image 一样的 <image> 数据类型！这些就豁然开朗了！
background-image 支持的那些<url>、<gradient>、element(、image(等等这些属性在mask-image中都是支持的?
mask-image这个语法的一半！
CSS数据类型的互通互联
举个例子：
background-image属性是支持 paint(函数的，但是我们现在问你，mask-image属性是否支持paint(函数？
但是，如果你记忆的是<image>类型，你可以迅速回答出：肯定支持，因为mask-image属性值支持<image>数据类型，<image>数据类型中存在paint(函数。
因此，大家一定要关注CSS的数据类型，这可以让我们学习CSS得新特性更迅速，理解CSS新特新更轻松！
试着学习几个常见的CSS数据类类型。
用记住的数据类型，去延伸出实际的属性值，也许会有额外的收获！