css3包含什么模块

这篇文章主要讲解了“css3包含什么模块”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“css3包含什么模块”吧！

css3包含的模块有：1、列表模块，用于给HTML列表添加样式；2、多列布局，它扩展块布局模式，以便更容易地定义多列文本；3、颜色模块，提供多种定义颜色的方式，例颜色名、rgb()、hsl()等；4、媒体查询，让CSS可以作用于不同的设备。

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

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

CSS演进的一个主要变化就是W3C决定将CSS3分成一系列模块。

早在2001年W3C就完成了CSS3的草案规范。CSS3规范的一个新特点是被分为若干个相互独立的模块。

• 一方面分成若干较小的模块较利于规范及时更新和发布，及时调整模块的内容，这些模块独立实现和发布，也为日后CSS的扩展奠定了基础。

• 另外一方面，由于受支持设备和浏览器厂商的限制，设备或者厂商可以有选择的支持一部分模块，支持CSS3的一个子集，这样有利于CSS3的推广。

以下为截至2021年1月，CSS3各模块的规范情况：

例如：

css3 颜色模块

CSS3支持的颜色表示方法

• 用颜色英文名称表示。英文名称代表一种颜色，但表示很有限且不易记忆和查询。

• 用十六进制的颜色表示。色光三原色原理，可以查表。

• 用 rgb (r, g, b) 表示。色光三原色原理，红色 + 绿色 + 蓝色。

• 用 hsl (Hue, Saturation, Lightness) 表示。色调 + 饱和度 + 亮度。

• 用 rgba (r, g, b, a) 表示。色光三原色原理，红色、绿色、蓝色 + 透明度。a ∈ [0, 1]，0代表完全透明。

• 用 hsla (Hue, Saturation, Lightness, alpha) 表示。色调、饱和度、亮度 + 透明度。alpha ∈ [0, 1]，0代表完全透明。

CSS3多列布局

CSS多列布局 扩展块布局模式，以便更容易地定义多列文本。如果一行太长，人们阅读文本很麻烦; 如果眼睛从一行的终点移动到下一个行的开始需要太长时间，它们就会丢失它们所在的行。因此，为了最大限度地利用大屏幕，作者应该将宽度不等的文本列并排放置，就像报纸一样。

css3 媒体查询

随着移动设备的快速普及，用户不再只是通过传统的电脑系来浏览 Web 内容，越来越多的用户开始使用各种尺寸的智能手机、平板电脑或者其它设备来浏览 Web 内容，为了确保使用不同设备的用户都能拥有不错的体验就需要用到媒体查询。

媒体查询是 CSS 样式表最重要的功能之一，所谓媒体查询指的就是根据不同的媒体类型（设备类型）和条件来区分各种设备（例如：电脑、手机、平板电脑、盲文设备等），并为它们分别定义不同的 CSS 样式。媒体查询能让 CSS 可以更精确的作用于不同的设备或同一设备的不同条件，让所有用户都能得到很好的用户体验。

/* 在小于或等于 992 像素的屏幕上，将背景色设置为蓝色 */
@media screen and (max-width: 992px) {
  body {
    background-color: blue;
  }
}
/* 在 600 像素或更小的屏幕上，将背景色设置为橄榄色 */
@media screen and (max-width: 600px) {
  body {
    background-color: olive;
  }
}

感谢各位的阅读，以上就是“css3包含什么模块”的内容了，经过本文的学习后，相信大家对css3包含什么模块这一问题有了更深刻的体会，具体使用情况还需要大家实践验证。这里是亿速云，小编将为大家推送更多相关知识点的文章，欢迎关注！