• 技术文章 >web前端 >前端问答

    css3包含哪些模块

    青灯夜游青灯夜游2022-04-25 15:38:40原创106

    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规范的一个新特点是被分为若干个相互独立的模块。

    以下为截至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.14
    Marquee模块
    工作组笔记
    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支持的颜色表示方法

    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包含哪些模块的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:CSS3
    上一篇:sort排序是es6中的吗 下一篇:es6的解构是什么意思
    Web大前端开发直播班

    相关文章推荐

    • css3双线边框是什么意思• css3层次选择器的用法是什么• css3属性选择器的用法是什么• 怎么设置rotate在css3的旋转中心点• css3清除浮动的几种方式是什么

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网