W3 CSS的CSS Snapshot 2022。

CSS Snapshot 2022

  • Abstract

    • 把截至到2022年位置的所有CSS相关的规范收集在一起

  • 1. Introduction

    • CSS Level 1、2都是在一个单文档中定义
    • CSS 3往后采用了模块化的方式
    • 此文档反映各模块在2022的状态

    • 1.1. What is CSS?

      • Cascading Style Sheets (CSS)
        • CSS是用于写作样式表单的语言，设计用来描述对结构化文档在不同媒介上的呈现。CSS所描述的是源文档的显示（presentation），通常不会设计文档结构的改动。

    • 1.2. Background: The W3C Process and CSS

      • Recommendation导轨的文档有三级稳定性
        • Working Draft
          • 规范的设计阶段
        • Candidate Recommendation
          • 规范的测试阶段
        • Recommendation (REC)
          • 文档的完成状态，由此进入维护模式
      • 此外，编辑手稿（Editor’s Draft）是包含最新内容，但未完全取得共识的版本。

  • 2. Classification of CSS Specifications

    • CSS的各模块状态，可以在https://www.w3.org/Style/CSS/current-work查看

    • 2.1. Cascading Style Sheets (CSS) — The Official Definition

    • 2.2. Fairly Stable Modules with limited implementation experience

    • 2.3. Modules with Rough Interoperability

    • 2.4. CSS Levels

      • 每个级别建构在前一个级别之上，完善定义以及添加特性。高级别包含低级别的特性。
      • CSS Level 1
      • CSS Level 2
        • 最新的应该是CSS2.1
      • CSS Level 3
        • 基于CSS2.1，分模块添加特性
      • CSS Level 4 and beyond
        • 分模块之后，就没有整体上的级别4了。

    • 2.5. CSS Profiles

      • 图略用于描述实现对CSS规范的遵从程度
      • 定义的图略不管用，就不继续了

  • 3. Requirements for Responsible Implementation of CSS

  • 4. Safe to Release pre-CR Exceptions

  • 5. Indices

  • 6. Acknowledgements

CSS2

  • 2 Introduction to CSS 2.1

    • 2.1 A brief CSS 2.1 tutorial for HTML

      • 通过LINK元素引入样式表
        • <LINK rel="stylesheet" href="bach.css" type="text/css">
        • 类型为text/css的样式表，地址为bach.css
        • 看来CSS只是准备作为样式表的一种语言啊
      • 也可以通过STYLE元素h直接指定CSS样式
      • CSS 2.1由超过90个辖属

    • 2.2 A brief CSS 2.1 tutorial for XML （略）

    • 2.3 The CSS 2.1 processing model

      • 概念上的处理模型

        • 解析源文档，并创建一颗文档树

        • 标识目标的媒介类型

        • 获取适用于当前媒介类型的，文档所关联的，所有样式表单

        • 为文档树中的每个元素添加注解，办法是针对当前媒介类型，为每个辖属指定一个值。辖属的赋值方式遵循层叠性和继承性

          有些值的计算取决于针对当前媒介类型的格式化算法。比如，媒介是屏幕的情况下，会应用视觉格式化模型。

        • 从注解过的文档树中，生成一个格式化结构，结构上类似于文档树，但包含修斗元素，以及其他生成的内容。

          • 首先，格式化结构的具体形式取决于实现，不一定需要为树状。
          • 其次，格式化结构包含的信息可能会多于或者少于文档树。
          • 值得注意的是，此阶段，CSS UA不会变更文档树，因样式表生成的内容不会反哺到原文档树

        • 将格式化结构传送到目标媒介

      • 2.3.1 The canvas

        • 对于所有媒介，画板一次用于描述格式化结构可以呈现的空间。
          • 此画板，在各个维度上无穷大，只是呈现的时候会限制在一个有限的区域之内。

      • 2.3.2 CSS 2.1 addressing model

        • CSS2.1的选取器和辖属允许样式表h引用文档的不同部分，如下所示：
          • 文档树中的元素，以及它们之间的关联
          • 文档树中的元素的属性，以及它们之间的关联
          • 元素内容的一些部分（比如:first-line和:first-letter）
          • 文档树中元素的特定状态（例如修斗标类）
          • 用于呈现文档的画板的某些方面
          • 一些系统信息

    • 2.4 CSS design principles

      • Forward and backward compatibility
        • CSS 2.1 UA必须能够理解CSS 1 样式表
        • CSS 1 UA必须能够读取CSS 2.1样式表，丢弃不支持的辖属
        • 不支持CSS的UA也必须能够呈现内容
      • Complementary to structured documents
        • 不会对结构化文档造成影响
      • Vendor, platform, and device independence
        • 独立于厂商、平台、以及设备。
      • Maintainability
        • 把样式管理集中在某些个文件中
      • Simplicity
        • 格式简单，易于书写
      • Network performance
        • 通常会降低需要传输的内容大小
      • Flexibility
        • 可以按照多种方式应用到内容上
        • 会考虑到浏览器的默认的样式信息，用户指定的样式信息等
      • Richness
        • 可以达成许多呈现效果
      • Alternative language bindings
        • 可以用JS来修改CSS辖属
      • Accessibility
        • 提供用于修改字体显示的辖属
        • 提供用于布局的辖属
        • !important可以用于满足特定的高优先级需求
        • ‘inherit’取值可以改进层叠递进的通用性
        • 提升的媒介支持，包括对braille，embossed，以及tty媒介类型，可以让用户和作者对特定的设备做定制

CSS Syntax Module Level 3

    1. Introduction
    • 定义了抽象措辞
    • 定义了所需的算法，用于将统编码的码点转化为CSS号牌，从而形成CSS对象（例如样式表，规则和声明）
    1. Description of CSS’s Syntax
    • CSS文档是一系列样式规则
      • 用于文档元素的qualified规则
      • 用于CSS文档自身的at规则
    • qualified规则h由prelude和一个{}落块构成
      • prelude指定适用元素
      • {}指定规则内容，由声明构成，声明用分号隔开
    • at规则以@开头，后跟名字（也作为CSS关键词）
      • 一些at规则是简单的陈述句，以分号结尾
      • 其他at规则是落块形式，用{}包裹，内容跟具体的规则相关
      • 辖属名和at规则名必须遵从ident序列
        • 开头要么是ident起始码点、两个连字符、或一个连字符后跟一个ident起始码点，然后可以跟0至多个ident码点
        • 通过转义，可以包含任意码点，甚至是那些用于CSS语法的
    • 2.1. Escaping
      • 可以用\来转义，后面可以跟
        • 任意统编码码点，只要不是十六进制数字或换行
        • 一到六位十六进制数字，后面可跟可选空白。这是以数值方式给出统编码码点
          • 此空白是为了方便跟其他非转义十六进制数字隔开，比如\26 B
          • 此空白会被吸收
    • 2.2. Error Handling
      • 解析出错的时候，解析器应该能够优雅处理错误，只丢弃少部分内容，然后恢复解析。
      • （给出了错误处理的一般性描述）
      • 解析出来的结构会检查是否符合语法，如果不符合会被忽略
    1. Tokenizing and Parsing CSS
    1. Tokenization
    1. Parsing
    1. The An+B microsyntax
    1. The Unicode-Range microsyntax
    1. Defining Grammars for Rules and Other Values
    1. CSS stylesheets
    1. Serialization
    1. Privacy and Security Considerations
    1. Changes

Selectors Level 3

  • Abstract
    • 选取器是用来匹配树中元素的模式，因此可以用来选择XML文档中的节点。
      • 为HTML和XML特别优化，设计成能够在高性能需求场景下工作。
    • 选取器定义了如下算函
      • expression * element -> boolean
    • 给定一个元素和一个选取器，此规范定义了哪些元素能匹配上
    • 提到了STTS（Simple Tree Transformation Sheets）
    1. Introduction
    • 1.1. Dependencies
    • 1.2. Terminology
    • 1.3. Changes from CSS2
    1. Selectors
    • 选取器代表一个结构，此结构可以用作一个条件，用来确定选取器能够匹配文档树中的哪些个元素
    • 选取器可以是简单的元素名，到复杂的情境相关的表示。
    • 语法总结如下
      • *，任意元素
      • E，任意类型为E的元素
      • E[foo]，具有属性"foo"的E元素
      • E[foo="bar"]，属性"foo"取值为"bar"的的E元素
      • E[foo~="bar"]，属性"foo"取值是逗号序列，某元素值为"bar"的E元素
      • E[foo^="bar"]，属性"foo"取值以"bar"开头的E元素
      • E[foo$="bar"]，属性"foo"取值以"bar"结尾的E元素
      • E[foo*="bar"]，属性"foo"取值带"bar"字符串的E元素
      • E[foo|="en"]，属性"foo"取值是连字符序列，以"en"开头的E元素
      • E:root，E元素，文档根节点
      • E:nth-child(n)，E元素，其上属的第n个子属
      • E:nth-last-child(n)， E元素，其上属的反向第n个子属
      • E:nth-of-type(n)，E元素，同类型的第n个同属
      • E:nth-last-of-type(n)，E元素，同类型的反向第n个同属
      • E:first-child，E元素，其上属的第一个子属
      • E:last-child，E元素，其上属的最后一个子属
      • E:first-of-type，E元素，同类型的第一个同属
      • E:last-of-type，E元素，同类型的最后一个同属
      • E:only-child，E元素，其上属的唯一个子属
      • E:only-of-type，E元素，同类型的唯一一个同属
      • E:empty，E元素，无子属（无文本节点）
      • E:link，E元素，超链接的源锚点，未被访问
      • E:visited，E元素，超链接的源锚点，已被访问
      • E:active、E:hover、E:focus
      • E:target，E元素，超链接的URI目标
      • E:lang(fr)，E元素，语言指定为"fr"
      • E:enabled、E:disabled
      • E:checked
      • E::first-line，E元素的首个格式化的行
      • E::first-letter，E元素的首个格式化的字母
      • E::before，在E元素前头生成的内容
      • E::after，在E元素后头生成的内容
      • E.warning，标类为"warning"的标类的E元素
      • E#myid，E元素，ID等于"myid"
      • E:not(s)，E元素，不匹配简单选取器s
      • E F，F元素，作为E元素的下级
      • E > F，F元素，作为E元素的子属
      • E + F，F元素，直接排在E之后
      • E ~ F，F元素，排在E之后
    1. Case sensitivity
    • 选取器在ASCII范围内不区分大小写
    • 元素名、属性名、以及属性值取决于文档语言
      • HTML中不区分大小写
      • XML中区分大小写
    1. Selector syntax
    • 一个选取器是一致多个简单选取器构成，以合并符隔开
      • 一个修斗选取器可以附加到选取器的最后一段简单选取器
    • 一个简单选取器的序列，是一串不以合并符分隔的简单选取器
      • 始终以type选取器或通用选取器开头，后不跟其他type选取器或通用选取器
    • 一个简单选取器要么是类型选取器、通用选取器、属性选取器、标类选取器、ID选取器、或修斗标类
    • 合并符包括空白、>、+等等
    • 选取器的作用对象，始终是最后一段简单选取器的作用对象
    • 选取器中的字符可以被反斜杠转义
    • 某些特定的选取器支持名字空间前缀
    1. Groups of selectors
    • 逗号分隔的选取器列表，代表这些选取器匹配到的元素的合集
      • 但是组中某个选取器出错，整体就失效了
    1. Simple selectors
    • 6.1. Type selector
      • 直接指定元素类型，比如h1
      • 6.1.1. Type selectors and namespaces（略）
    • 6.2. Universal selector
      • 匹配任意元素
        • 6.2.1. Universal selector and namespaces（略）
    • 6.3. Attribute selectors
      • 6.3.1. Attribute presence and value selectors
      • 6.3.2. Substring matching attribute selectors
      • 6.3.3. Attribute selectors and namespaces（略）
      • 6.3.4. Default attribute values in DTDs
    • 6.4. Class selectors
    • 6.5. ID selectors
    • 6.6. Pseudo-classes
    1. Pseudo-elements
    • 7.1. The ::first-line pseudo-element
    • 7.2. The ::first-letter pseudo-element
    • 7.4. The ::before and ::after pseudo-elements
    1. Combinators
    • 8.1. Descendant combinator
    • 8.2. Child combinators
    • 8.3. Sibling combinators
    1. Calculating a selector’s specificity
    • （过）
    1. The grammar of Selectors
    1. Profiles
    1. Conformance and requirements
    1. Tests
    1. Acknowledgements
    1. References

CSS Cascading and Inheritance Level 4

  • Abstract
    • 描述如何校勘样式规则以及分配取值给元素的所有辖属
    • 通过递进和继承的方式，取值传播给所有元素的辖属
    1. Introduction
    • CSS定义了有限的参数集，叫做辖属，用来控制文档的呈现。
      • 每个辖属有一个名字、一个取值空间、以及定义了的文档呈现的影响
      • 通过辖属声明，把辖属值赋给文档的各个部分
    • 设计原则上，CSS支持层叠递进（叠进），也就是多个样式表单可以影响文档的呈现
      • 其中冲突的部分需要以某种方式解决
    • 如果一个辖属没有指定取值，那么可以通过继承或者采用初始值的方式，来确定一个取值，这叫defaulting
    • 文档情境下的取值在此模块中描述
      • 页面情境下的取值在css-page-3中描述
    • 1.1. Module Interactions
      • 文本节点被当做元素子属，拥有全部辖属集
        • 由于文本不能被选取器命中，它们的属性值靠defaulting
    1. Importing Style Sheets: the @import rule
    • ‘@import’规则允许用户导入其他样式表中的规则，就像把其他样式表粘贴复制到’@import’所在的位置一样，但是有一些异常
      • 如果一个特性（比如’@namespace'）明确定义只适用于某些样式表，那么可能不适用于导入的样式表
      • 如果一个特性依赖于样式表结构的次序，那么只在那个样式表的结构之中生效
    • ‘@import’必须在其他的at-rule之前（除了’@charset'），否则无效
    • ‘@import’的语法除了url之外，还可以指定适用条件，比如：support和<media-query-list>
    • 2.1. Conditional @import Rules
    • 2.2. Processing Stylesheet Imports
    • 2.3. Content-Type of CSS Style Sheets
      • 对于导入的样式表的处理，依赖于链接的资源的具体类型
        • 如果资源没有内容类型元数据，那么类型被当做text/css
        • 如果宿主文档在quirks模式，有一些特殊处理
        • 其他情况下，依据内容类型元素据
    1. Shorthand Properties
    • 有些辖属是短形式的，也就是可以在单个辖属中指定多个子下属长形式辖属的值
    • 短形式中没有设置的长形式的辖属，其值为初始值
      • （做了额外的说明，举了一个例子）
    • 一些情况下，短形式可能有不同的措辞或者特殊的关键词，并不能直接对应到其子辖属
    • 一些情况下，短形式只会重置某些子长形式辖属的值，称为只重置的辖属
    • 如果短形式指定了某个CSS范围的关键词，它将所有子辖属设置为那个关键词，即便是只重置的辖属
    • 声明一个短形式辖属为’!important’相当于声明所有的子辖属为'!important'
    • 3.1. Property Aliasing
      • CSS定义了两种不同的方式来将旧措辞"aliasing"到新措辞
        • legacy name aliases
          • 如果取值定义相同的话，可以把旧辖属直接对照到新辖属
        • legacy shorthands
          • 如果取值定义不同的话，通过短形式机制来取别名
            • 例子：
              • 'page-break-*'是'break-*'的短形式
              • 解析时’page-break-before: always’扩展成’break-before: page'
              • 同样的，当’break-before: page’设置时，调用getComputedStyle(el).pageBreakBefore返回"always"，但是序列化的时候不会选用’page-break-before'
    • 3.2. Resetting All Properties: the all property
      • 此为短形式，用于重置除了’directoin’和’unicode-bidi’之外的，所有的CSS辖属。
        • 只接受CSS范围的关键词
        • 不重置自定义辖属
    1. Value Processing
    • 对于文档树中的每个元素，以及对应的格式化结构中的每个箱体，它们的每个辖属必须被赋予一个适合当前媒体类型的取值
    • 对于给定元素或者箱体，其辖属的最终取值由多个步骤给出
      • 对于某元素，所有声明了的取值（零至多个），都会被收集起来
      • 叠进会给出叠进的取值，元素上的每个辖属最多有单个叠进取值
      • 缺省会给之既定值，元素上的每个辖属只有一个既定值
      • 根据取值的依赖关系，会得出算出值，元素上的每个辖属只有一个算出值
      • 文档格式化会给出定用值，元素上的每个辖属可有一个定用值
      • 用定值会被转化为实际值，转化会基于展示环境的约束来。和定用值一样，元素上的每个辖属可有一个实用值
    • 没有连结到文档，或者文档flat tree以外的部分，不参与CSS取值处理，没有上属这些取值。
    • 4.1. Declared Values
      • 4.1.1. Value Aliasing
    • 4.2. Cascaded Values
    • 4.3. Specified Values
    • 4.4. Computed Values
    • 4.5. Used Values
      • 对算出值做进一步加工
      • 例子
        • 算出值’width: auto’会本剧元素上级的布局求解出具体值
      • 4.5.1. Applicable Properties
        • 有些不生效
    • 4.6. Actual Values
      • 定用值可能不适合当前环境，实际使用的时候可能要做一些调整的
    • 4.7. Examples
      • （嗯，列举了很多例子）
    1. Filtering
    • 一个取值的声明是否使用于一个元素，取决于：
      • 属于当前文档的样式表
      • 条件规则给出其适用于当前文档
      • 属于一条规则，此规则的选取器能够匹配当前元素
      • 措辞上是有效的，辖属名是有效的，声明中的取值措辞符合辖属的要求
    1. Cascading
    • 叠进是对某个给定元素上的辖属，把所有声明的取值构成的列表进行排序，最后确定出一个叠进值
    • 6.1. Cascade Sorting Order
      • 优先级从高到低
        • Origin and Importance
          • 来源优先级
            • css-transitions-1
            • 来自UA的重要声明
            • 来自用户的重要声明
            • 来自作者的重要声明
            • css-animations-1
            • 来自作者的普通声明
            • 来自用户的普通声明
            • 来自UA的普通声明
        • Context
          • 从不同封装情境（此处设计影子树体）看
            • 普通规则外部情境胜出
            • 重要规则内部情境胜出
        • Specificity
          • 选择器的特定性越高的规则获胜
            • 不从属于某些样式规则的声明被认为具有最高的特定性
        • Order of Appearance
          • 文档中最后出现的声明获胜，为此
            • 从’imported style sheets’而来的声明，会被视为是直接插入到其导入处
            • 以链接形式引用的，会按照链接出现的次序来拼接起来
            • 从样式属性而来的声明，会按照主元素在文档中的位置而定
    • 6.2. Cascading Origins
      • 每条样式规则具有叠进来源
        • Author Origin
        • User Origin
        • User-Agent Origin
      • 对CSS的扩展引入下面额外的来源
        • Animation Origin
        • Transition Origin
    • 6.3. Important Declarations: the !important annotation
    • 6.4. Precedence of Non-CSS Presentational Hints
    1. Defaulting
    • 如果叠进没有产生一个取值，那么必须以其他方式产生一个取值
      • 可以从继承来获取默认值
      • 可以获取规范中的初始值
        • 作者可以强制指定继承或者初始值
    • 7.1. Initial Values
      • 每个辖属有初始取值，在辖属的定义表中有给出。
    • 7.2. Inheritance
      • 根元素，因为没有父属，其继承值来自于初始值。
      • 对于具有蔽光的DOM树体，其继承操作于放平的元素树体之上。
        • 也就是说槽位元素从插入处继承，而不是透光树体
      • 一些辖属是继承的辖属，它们的取值决定于继承
      • 可以强制指定’inherit’关键词来让辖属具有继承性
    • 7.3. Explicit Defaulting
      • 定义了几个CSS范围的辖属取值
      • 7.3.1. Resetting a Property: the initial keyword
        • 如果一个辖属的叠进值是’initial’关键词，那么此辖属的规定取值是其初始值
      • 7.3.2. Explicit Inheritance: the inherit keyword
        • 如果一个辖属的递进值是’inherit’关键词，那么此辖属的规定取值和算出取值是其继承而来的值
      • 7.3.3. Erasing All Declarations: the unset keyword
        • 如果是继续的辖属，那么取值当做’inherit'，如果不是，取值当做’initial'
      • 7.3.4. Rolling Back Cascade Origins: the revert keyword
        • 取值取决于声明来源地
          • 来源于UA
            • 等同于’unset'
          • 来源于用户
            • 回退到UA级别
          • 来源于作者
            • 回退到用户级别
    1. Changes
  • Conformance

CSS Values and Units Level 3

  • Abstract
    • 定义了CSS辖属可以接受的公共取值和单位，以及在CSS辖属定义中使用它们的语法
    1. Introduction
    • CSS辖属的定义可以包含关键词、数据类型（在'<‘和’>'）之间，以及它们是如何合并的。通用数据类型（比如<length>）可以被许多辖属所使用。
    1. Value Definition Syntax
    • 此措辞用于定义CSS辖属的有效取值；定义的取值可以有一至多个成分。
    • 2.1. Component Value Types
      • 组件取值类型按下面几种方式指定
        • 关键词取值（比如’auto', ‘disc’等）
        • 基本数据类型，比如<length>, <percentage>等，对于数值数据类型，可以加上范围
        • 具有相同取值范围的类型，作为辖属承载有相同的名字，例如<'border-width'>，<'background-attachment'>。此种情，比如’inherit’，也不包含首级别的逗号分隔的列表
        • 不同名字的非端子作为辖属，此种情况下，非端子用尖括号包含，例如<spacing-limit>
          • 注意到<border-width>和<'border-width'>是不同的
        • 一些辖属的取值定义也包含/和,，可加上括弧。其他非关键词字面上的字符可以出现在一个成分取值中，例如"+"，必须加上单引号
        • 此语法中的逗号，在某些特定情况下，可以隐式忽略。
          • （具体规则略）
          • 例子：example( first? , second? , third? )
    • 2.2. Component Value Combinators
      • 成分取值可以按照如下方式构成辖属取值：
        • Juxtaposing意味着所有成分必须出现，顺序按照给定
        • &&隔开多个成分，被隔开的必须出现，顺序可以任意
        • ||隔开多个选项，其中有一个须出现，顺序可以任意
        • |隔开多个候补，必须有一个出现
        • []用作围合
      • Juxtaposing强于&&，后者强于||，后者强于|
    • 2.3. Component Value Multipliers
      • 每个类型，关键词，或者方括号围合可以用下面的修饰符：
        • 星号*表示零始重复
        • 加号+表示一始重复
        • 问好?表示可选
        • {A}表示重复A次
        • {A, B}指定重复次数的下限和上限
        • 井号#表示逗号分隔的重复
          • 支持形如：<length>#{1,4}
        • 叹号!出现在围合之后表示围合是必须的，至少要有一个值
      • 对于重复的操作，UA必须支持最少20个重复成分
    • 2.4. Combinator and Multiplier Patterns
      • 有一些将单独的成分的取值组合起来的方式，数目和顺序可以特别指定。
        • 也就是说语法上能够以任意顺序从一堆成分中指定，零至多个、一至多个、全局所有
      • 例子
        • 零至多个
          • 按顺序：A? B? C?
          • 任意顺序：A? || B? ||C?
        • 一至多个
          • 按顺序：[ A? B? C? ]!
          • 任意顺序：A || B || C
        • 所有
          • 按顺序：`A B C'
          • 任意顺序：A && B && C
    • 2.5. Component Values and White Space
      • 除非特别指定，当使用组合符和倍乘符时，空白和注释能够出现在成分周围
    • 2.6. Property Value Examples
      • （一些取值定义的示例）
    1. Textual Data Types
    • （待续）

CSS Backgrounds and Borders Level 3

  • Abstract
    • 跟间隔和背景相关
      • 跟CSS 2相比，扩展之处在于：间隔可以由图像构成、箱体可有多重背景、箱体可以有圆角间隔、箱体可以有阴影
    1. Introduction
    • 按箱体模型展示元素时，每个元素要么不展示，要么展示成一到多个矩形箱体
      • 每个箱体有矩形内容区域，一个内收带，一个间隔带，一个外突带
        • 外突可以为负值，但是对内收待和间隔带无影响
    • 此模块中的辖属用于处理以上提到的主题
    • 如果一个元素断分到多个箱体，那么‘box-decoration-break’可以用于定于间隔和背景如何在不同的箱体中划分
      • 一个元素在行末、栏末、页末可能出现断分部分内容到下一行、栏、页。
    • 本模块还给出背景、间隔和阴影的堆叠次序
    • 1.1. Module Interactions
      • 此模块中的所有辖属应用于::first-letter修斗元素
      • 背景辖属以及间隔radius辖属应用于::first-line修斗元素
        • UA或可应用’border-image’或’box-shadow’辖属到::first-line
        • UA不能应用border-color/style/width辖属到::frist-line
    • 1.2. Value Definitions
      • 遵循CSS辖属定义约定，使用取值定义语法
      • 此模块中定义的辖属，也遵循CSS-wide关键词
    • 1.3. Animated Values
      • Animatable是为了CSS动画过渡准备的
    1. Backgrounds
    • 每个箱体有一个背景层，可以是完全透明的（默认的），或者填充一个颜色，或者一致多个图像
      • 颜色由’background-color’指定
      • 图像由’background-image’指定
      • 同时定义了这些背景是怎么定大小、位置、拼接的等等
    • 2.1. Layering Multiple Background Images
      • 背景可以有多个层级，由’background-image’辖属的逗号分隔的列表决定，即便是’none’也会创建一个层级
      • 列表中出现重复的辖属的话，只有第一个会被采用
      • 列表中的条目不够的话，UA需要重复之以匹配层级数目
      • 例子： 
        • background-image: url(flower.png), url(ball.png), url(grass.png);
background-position: center center, 20% 80%, top left, bottom right;
background-origin: border-box, content-box;
background-repeat: no-repeat;
      • 列表中第一个出现的的最靠近用户，如果指定了背景颜色，那么会被放置在离用户最远额一层
    • 2.2. Base Color: the background-color property
      • 会被最底层的background-clip辖属指定的值所裁剪
    • 2.3. Image Sources: the background-image property
      • 作者指定背景图像的同时，应该指定一个’background-color’以便在图像无法显示的时候与文本形成差异，使其可读。
      • 从访问性角度，不应使用背景图像作为传递信息的单一手段
    • 2.4. Tiling Images: the background-repeat property
      • 其取值是一个列表，每个条目是一对关键词，每个关键词对应一个维度
      • （示例略）
    • 2.5. Affixing Images: the background-attachment property
      • 其取值是一个列表，每个条目是一个关键词
      • 指定了背景图像的情况下，此辖属规定了图像是否需要固定于视界
      • (解释略)
    • 2.6. Positioning Images: the background-position property
      • 指定了背景图像的情况下，此辖属规定了图像（大小调整后）在背景区域内的位置
    • 2.7. Painting Area: the background-clip property
    • 2.8. Positioning Area: the background-origin property
    • 2.9. Sizing Images: the background-size property
    • 2.10. Backgrounds Shorthand: the background property
    • 2.11. Backgrounds of Special Elements
    1. Borders
    • 间隔可以是预定义的样式（实线、双线、虚线、修斗3D间隔，或者是图像
      • 前一种情况下，可以应用多种辖属，比如’border-style', ‘border-color’, 或者’border-width'
      • 3.1. Line Colors: the border-color properties
      • 3.2. Line Patterns: the border-style properties
      • 3.3. Line Thickness: the border-width properties
      • 3.4. Border Shorthand Properties
    1. Rounded Corners
    1. Border Images
    1. Miscellaneous Effects
    1. Definitions
    1. Changes
    1. Acknowledgments
  • Conformance

CSS Box Model Level 3

  • Abstract
    • 描述环绕CSS箱体的外突和内收辖属
    1. Introduction
    • 布局的话，需要将文档树转化为一个箱体集合，并决定它们在画布上的的大小、位置以及堆叠。
    • 每个CSS箱体是一个长方形的内容区域，环绕有内收带、间隔、外突
    • 外突和内收定义在此模块，间隔定义在CSS Background模块
    • 1.1. Value Definitions
    • 1.2. Module Interactions
    1. The CSS Box Model
    • 每个元素箱体有一个内容区域，以及环绕在内容区域的内收带、间隔带、以及外突带
      • 内收、间隔、外突都可以按照top, right, bottom, left的方位来单独控制
    • 每个带都有边缘
      • 内容边缘或内边缘
        • 定义了内容箱体
      • 内收边缘
        • 定义了内收箱体，如果无内收，那么等同于内容边缘
      • 间隔边缘
        • 定义了间隔箱体，如果无间隔，那么等同于内收边缘
      • 外突边缘或者外边缘
        • 定义了外突箱体，如果无外突，那么等同于间隔边缘
    • 内容、内收，以及间隔区域的背景可以由’backgrund’辖属指定
      • 间隔样式可以由’border’辖属来控制
    • 如果一个箱体割裂（由分行、分页等情况导致）成若干个箱体裂片。则它们的边带由’box-decoration-break’辖属指定。
    • 2.1. Box-edge Keywords
      • 定义了以下CSS关键词供使用（比如在辖属’transform-box’或’background-clip’中）
        • ‘content-box’
        • ‘padding-box’
        • ‘border-box’
        • ‘margin-box’
        • ‘fill-box’，对应object bounding box及其边缘
        • ‘stroke-box’，对应stroke bounding box及其边缘
        • ‘view-box’，跟SVG相关
      • 方便起见，定义了以下取值类型
        • <visual-box>
        • <layout-box>
        • <paint-box>
        • <coord-box>
    1. Margins
    • 外突辖属规范了外突带的厚度
      • ‘margin’短形式辖属可以给四个边设置外突
        • 对应的长形式辖属可以给单个边设置外突
        • flow相关的’margin’在 CSS Logical Properties and Values Level 1中定义
      • 在落块布局中，相接的外突会折叠。与割裂部分相接的外突有时候会被截断
      • 3.1. Page-relative (Physical) Margin Properties: the margin-top, margin-right, margin-bottom, and margin-left properties
      • 3.2. Margin Shorthand: the margin property
        • 设置四边的外突，设置形式可以有单个值、两个值、三个值、四个值
    1. Padding
    • 基本上与上一章类似
    1. Borders
    • 具体在css-background-3中定义
    1. Changes Since CSS Level 2
    1. Privacy and Security Considerations

（此处是底线）