Terminology
anjia opened this issue · comments
Object-Sizing
- intrinsic dimensions
- specified size
- default object size
- concrete object size
intrinsic dimensions 内在/固有尺寸
intrinsic dimensions 是指 intrinsic height, intrinsic width 和 intrinsic aspect ratio（宽高比）的集合。对于特定对象，每个都是有可能存在，也可能不存在。intrinsic dimensions 代表物体本身的 preferred 或者 natural size，它与上下文无关。CSS 没有定义如何找出 intrinsic dimensions。
举例：
- 有3个的：raster images（光栅图像）是同时拥有这三个 intrinsic dimensions 的对象
- 有1个的：SVG image 可能只有一个，那就是 intrinsic aspect ratio
- 有0个的：
- CSS gradients，它就没有一个 intrinsic dimensions
- embedded documents 也没有，比如 HTML 里的
<iframe>元素
- 有2个的：
- 通常，对象不能只有两个 intrinsic dimensions，因为任何两个都会自动算出第三个维度
- 但是，有些 replaced elements（比如 form 控件）就只有两个，有 intrinsic width 和 intrinsic height 而没有 intrinsic aspect ratio
如果一个对象（比如 icon）有多个 sizes，则将最大的 size（按面积）作为它的 intrinsic size。如果在那个 size 上它有多个 aspect ratios，或者有多个 aspect ratios 但是没 size，则就使用最接近 default object size 的 aspect ratio 的 aspect ratio。通过使用 contain constraint（包含约束）fit 来看哪一个 aspect ratio 在 default object size 里 fitting 后的面积最大；如果最大面积有多个 sizes，那就选 the widest size 作为它的 intrinsic size。
specified size 指定大小
一个对象的 specified size 是由 CSS 指定的，比如通过 width, height, 或者 background-size 属性。
specified size 可以是确定的 width 和 height，可以是一组约束，也可以是它们的组合。
default object size 默认对象大小
default object size 是一个具有确定 height 和 width 的矩形，用来在既没有 intrinsic dimensions 也没有 specified size 的时候，确定 concrete object size 的。
concrete object size 具体对象大小
concrete object size 是综合对象的 intrinsic dimensions、specified size 以及 default object size，从而生成一个有明确 width 和 height 的矩形。
Value Processing
1. declared values
2. cascaded values
3. specified value 指定值
4. computed value 计算值
computed value 是解析 specified value 的结果，通常会 absolutizing it（将它绝对化）以用于 inheritance
- specified value 是 property definition table 中的 Computed Value 行定义的
- computing 一个 relative value 通常会 absolutizes it
- specified value 可以是 absolute（i.e. 不相对于另一个值，例如
red和2mm），也可以是 relative（i.e. 是相对于另一个值，例如auto和2em） - absolutize relative value
- 值是相对单位的（
emexvhvw）必须乘以适当的 reference size 变成 absolute 的 - certain keywords（比如
smallerbolder）必须根据其定义被替换掉 - percentage 必须乘以相应的 reference value
- 有效的 valid relative URLs 必须解析成 absolute 的
- 值是相对单位的（
- specified value 可以是 absolute（i.e. 不相对于另一个值，例如
- 注意：
- computed value 是 inheritance 期间从 parent 传到 child 的 value。由于历史原因，它不一定是
getComputedStyle()函数的返回值 - 通常，the computed value 解析 the specified value 时，会尽可能的不 laying out the document，也尽可能的不执行其它 expensive 或者 hard-to-parallelize（难以并行化的）操作，比如解析 network requests 和 retrieving 既不是本元素的也不是其父元素的 values
- computed value 是 inheritance 期间从 parent 传到 child 的 value。由于历史原因，它不一定是
computed value 也可能存在，即使 property 没有 apply-应用（属性定义表格里的 Applies To 行会给出）。但是，some properties 可能会根据 property 是否应用于 element 来更改确定 computed value 的方式。
5. used value
6. actual values
shorthand property
shorthand property
longhand sub-properties
有些 properties 是 shorthand properties，这意味着它们允许 authors 使用 single property 指定 several properties 的值。shorthand property 设置其所有的 longhand sub-properties。
eg. background font
若 shorthand 形式里省略了某些值，除非另外定义，否则每个 missing 的 sub-property 会被分配成它的 initial value。
Abstract Box Terminology
CSS 里有三组 directional terms（方向性术语）：
physical 是相对 page 的，和 writing mode 无关。physical directions 包括：
- left, right
- top, bottom
flow-relative 是相对 the flow of content（内容流）的。flow-relative directions 包括：
- start, end
- block-start, block-end
- inline-start, inline-end（如何 dimension 也不明确）
line-relative 是相对 orientation of the line box 的。line-relative directions 包括：
- line-left, line-right
- line-over, line-under
physical dimensions（物理尺寸）是 width 和 height，分别对应沿 x-axis（horizontal dimension）和 y-axis（vertical dimension）的 measurements（测量值）。Abstract dimensions（抽象尺寸）在 flow-relative 和 line-relative 的术语中都是一样的，所以只有一组术语。
flexbox 还定义了 flex-relative 术语，用于描述 flex layout
1. Abstract Dimensions
- block dimension
- inline dimension
- block axis
- inline axis
- block size / logical height
- inline size / logical width
2. Flow-relative Directions
- block-start
- block-end
- inline-start
- inline-end
3. Line-relative Directions
- over / line-over
- under / line-under
- line-left
- line-right
4. Abstract-to-Physical Mappings
下面的表格总结了 abstract-to-physical mappings：
点击查看最新的