回答css3包含哪些模块

 所属分类:web前端开发

 浏览:148次-  评论: 0次-  更新时间:2022-11-01
描述:更多教程资料进入php教程获得。 css3包含的模块有:1、列表模块,用于给HTML列表添加样式;2、多列布局,它扩展块布局模式,以便更容易地定...
更多教程资料进入php教程获得。

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

前端(vue)入门到精通课程:进入学习
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API调试工具:点击使用

本教程操作环境: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各模块的规范情况:

时间名称最后状态模块
1999.01.27 - 2019.08.13文本修饰模块候选推荐css-text-decor-3
1999.06.22 - 2018.10.18分页媒体模块工作草案css-page-3
1999.06.23 - 2019.10.15多列布局工作草案css-multicol-1
1999.06.22 - 2018.06.19颜色模块推荐css-color-3
1999.06.25 - 2014.03.20命名空间模块推荐css-namespaces-3
1999.08.03 - 2018.11.06选择器推荐selectors-3
2001.04.04 - 2012.06.19媒体查询推荐css3-mediaqueries
2001.05.17 - 2020.12.22文本模块候选推荐css-text-3
2001.07.13 - 2021.02.11级联和继承推荐css-cascade-3
2001.07.13 - 2019.06.06取值和单位模块候选推荐css-values-3
2001.07.26 - 2020.12.22基本盒子模型候选推荐css-box-3
2001.07.31 - 2018.09.20字体模块推荐css-fonts-3
2001.09.24 - 2020.12.22背景和边框模块候选推荐css-backgrounds-3
2002.02.20 - 2020.11.17列表模块工作草案css-lists-3
2002.05.15 - 2020.08.27行内布局模块工作草案css-inline-3
2002.08.02 - 2018.06.21基本用户界面模块推荐css-ui-3
2003.05.14 - 2019.08.02生成内容模块工作草案css-content-3
2003.08.13 - 2019.07.16语法模块候选推荐css-syntax-3
2004.02.24 - 2014.10.14超链接显示模块工作组笔记css3-hyperlinks
2005.12.15 - 2015.03.26模板布局模块工作组笔记css-template-3
2006.06.12 - 2014.05.13分页媒体模块生成内容工作草案css-gcpm-3
2008.08.01 - 2014.10.14Marquee模块工作组笔记css3-marquee
2009.07.23 - 2020.12.17图像模块候选推荐css-images-3
2010.12.02 - 2019.12.10书写模式推荐css-writing-modes-3
2011.09.01 - 2020.12.08条件规则模块候选推荐css3-conditionalr
2012.02.07 - 2020.05.19定位布局模块工作草案css-position-3
2012.02.28 - 2018.12.04片段模块候选推荐css-break-3
2012.06.12 - 2020.04.21盒子排列模块工作草案css-align-3
2012.09.27 - 2020.12.18宽高大小模块工作草案css-sizing-3
2012.10.09 - 2017.12.14计数器风格候选推荐css-counter-styles-3
2013.04.18 - 2020.06.03溢出模块工作草案css-overflow-3
2014.02.20 - 2020.12.18显示类型模块候选推荐css-display-3

例如:

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;
  }
}
登录后复制

(学习视频分享:css视频教程、web前端)

以上就是css3包含哪些模块的详细内容,更多请关注zzsucai.com其它相关文章!

 标签: css3,
积分说明:注册即送10金币,每日签到可获得更多金币,成为VIP会员可免金币下载! 充值积分充值会员更多说明»

讨论这个素材(0)回答他人问题或分享使用心得奖励金币

〒_〒 居然一个评论都没有……

表情  文明上网,理性发言!