CSS 属性值定义语法 - CSS:层叠样式表

CSS 属性值定义语法CSS 属性值定义语法(CSS value definition syntax)是用来限定 CSS 属性合法取值的专门语法。在此基础之上,一个 CSS 属性的合法取值也由语义所限制,比如一些数字必须是正数。

CSS 属性值定义语法描述了哪些值是可取的 CSS 属性,基本组成元素包括关键字、符号与带类型的参数。

基本组成元素关键字一般关键字

有预定义含义的一般关键字按字面意义出现,不需要引号,如auto, smaller 或 ease-in。

特殊关键字:inherit、initial和unset

所有 CSS 属性值都可以使用inherit、initial和unset,它们的定义贯穿 CSS 始终。它们未显示在值定义中,但都是隐含可用的。

符号CSS 中,有一些符号是可以出现的,比如斜杠 ('/') 或者逗号 (',') 等。它们用来分隔属性值:逗号用来分隔数个并列值,或者分隔函数的参数;斜杠用来分隔一个值的多个部分,通常用在 CSS 缩写中分离具有相同类型但属于不同属性的组件。

这两种符号会以其字面意义出现在 CSS 属性值定义中。

带类型的参数基本类型

一些类型在 CSS 中经常出现,CSS 规范中将其专门定义,称为基本类型,用一对尖括号表示:'<'与'>',例如:, , …

其他类型

其他类型同样也用一对尖括号表示:'<'与'>'。

其他类型分为两种:

共享同一个属性名称的数个类型。在这种情况下,数据类型与属性共享同一组值。它们出现在一对引号之中,经常用于属性的缩写。

不共享同一个属性名称的数个类型,它们与基本类型很相似,不同是:这种参数仅在规范中相关属性的描述处定义,而基本类型在规范中有专门定义。

组合符号方括号方括号将数个基本元素组成一个整体,用来强调组合的优先级。例如:

cssbold [ thin && ]

以下均为该例的合法取值:

bold thin 2vh

bold 0 thin

bold thin 3.5em

但以下不是合法取值:

thin bold 3em 因为bold被放置在方括号定义的整体之中。根据定义,bold必须出现在方括号定义的整体之前。

并置并置是指将数个关键字、符号或类型,用空格分开写在一起。并置中所有的元素都必须出现并且按所规定的顺序出现。例如:

cssbold , thin

以下均为该例的合法取值:

bold 1em, thin

bold 0, thin

bold 2.5cm, thin

bold 3vh, thin

但以下不是合法取值:

thin 1em, bold因为顺序有错。

bold 1em thin因为所有元素都必须出现,包括逗号。

bold 0.5ms, thin因为ms是时间值,不是长度值:

“与”组合符:&&“与”组合符连接的各个部分都必须出现,但是顺序任意。例如:

cssbold &&

以下均为该例的合法取值:

bold 1em

bold 0

2.5cm bold

3vh bold

但以下不是合法取值:

bold因为长度值没有出现。

bold 1em bold因为各部分必须恰好出现一次。

备注:

并置的优先级高于“与”组合符。例如 bold thin && 等价于 [ bold thin ] && 。它们的合法取值是:bold thin bold thin 但不是 bold thin。

“或”组合符:||“或”组合符表示其连接的所有组成元素是可选的,次序任意,但是至少其中一个要出现。“或”组合符通常用来描述属性缩写中的各部分。

css<'border-width'> || <'border-style'> || <'border-color'>

以下均为该例的合法取值:

1em solid blue

blue 1em

solid 1px yellow

但以下不是合法取值:

blue yellow因为一个组成部分最多出现一次。

bold因为它不允许出现。

备注:

“与”组合符的优先级高于“或”组合符,比如 bold || thin && 等价于 bold || [ thin && ]。它们的合法取值是:bold, thin , bold thin , 或者 thin bold ,但不是: bold thin 因为 bold 若出现,则必须出现在 thin && 整体的前面或后面。

“互斥”组合符:|“互斥”组合符表示各组成部分中只能恰好出现一个,通常用来分隔一个属性的所有可选值。例如:

css | | left | center | right | top | bottom

以下均为该例的合法取值:

3%

0

3.5em

left

center

right

top

bottom

但以下不是合法取值:

center 3% 因为最多只能出现一个组成部分

3em 4.5em 因为每个组成部分最多只能出现一次

备注:

“或”组合符的优先级高于“互斥”组合符,比如bold | thin || 等价于bold | [ thin || ]。它们的合法取值是:bold, thin, , thin, 或 thin ,但不能是 bold ,因为“互斥”组合符所连接的数个部分中,只有一个能出现。

数量符号数量符号用来描述一个元素可以出现多少次。若不标注,则这个元素比如恰好出现一次。

注意数量描述符不能叠加出现,并且优先级最高。

星号 (*)星号表示可以出现零次(即不出现),一次,或任意多次。例如:

cssbold smaller*

以下均为该例的合法取值:

bold

bold smaller

bold smaller smaller

bold smaller smaller smaller and so on.

但以下不是合法取值:

smaller 因为bold并置于smaller,必须出现在任何smaller之前。

加号 (+)加号表示可以出现一次或多次。例如:

cssbold smaller+

以下均为该例的合法取值:

bold smaller

bold smaller smaller

bold smaller smaller smaller and so on.

但以下不是合法取值:

bold 因为smaller必须出现至少一次。

smaller 因为bold 是并置关系,必须在smaller之前出现。

问号 (?)问号表示可选,即出现零次或一次。例如:

cssbold smaller?

以下均为该例的合法取值:

bold

bold smaller

但以下不是合法取值:

bold smaller smaller 因为smaller最多出现一次。

smaller 因为bold是并置关系,必须出现在smaller之前。

大括号 ({ })大括号包含两个以逗号分隔的整数 A 与 B,表示最少出现 A 次,且最多出现 B 次。例如:

cssbold smaller{1,3}

以下均为该例的合法取值:

bold smaller

bold smaller smaller

bold smaller smaller smaller

但以下不是合法取值:

bold 因为smaller 至少要出现一次。

bold smaller smaller smaller smaller 因为smaller 最多出现三次。

smaller 因为bold是并置关系,必须出现在smaller之前。

井号 (#)井号表示可以出现一次或多次,与加号相似。但是其多次出现必须以逗号分隔。例如:

cssbold smaller#

以下均为该例的合法取值:

bold smaller

bold smaller, smaller

bold smaller, smaller, smaller and so on.

但以下不是合法取值:

bold 因为smaller必须至少出现一次。

bold smaller smaller smaller 因为多个smaller必须以逗号分隔。

smaller 因为bold是并置关系,必须出现在smaller之前。

叹号 (!)组后面的叹号表示该组是必需的,并且至少产生一个值;即使组内项目的语法允许省略全部的值,也至少要保留一个值。

css[ bold? smaller? ]!

以下均为该例的合法取值:

bold

smaller

bold smaller

但以下不是合法取值:

bold 和 smaller都没有:因为至少要出现一个。

smaller bold:因为 bold 必须出现在 smaller 前面。

bold smaller bold:因为 bold 只能出现一次。

总结

符号

名称

描述

示例

组合符号

并置

各部分必须出现且按顺序出现

solid

&&

“与”组合符

各部分必须出现,但可以不按顺序

&&

||

“或”组合符

各部分至少出现一个,可以不按顺序

<'border-image-outset'> || <'border-image-slice'>

|

“互斥”组合符

各部分恰好出现一个

smaller | small | normal | big | bigger

[ ]

方括号

强调优先级

bold [ thin && ]

数量符号

无数量符号

恰好一次

solid

*

星号

零次、一次或多次

bold smaller*

+

加号

一次或多次

bold smaller+

?

问号

零次或一次(即可选)

bold smaller?

{A,B}

大括号

至少A次,至多B次

bold smaller{1,3}

#

井号

一次或多次,但多次出现必须以逗号分隔

bold smaller#

!

叹号

组必须产生一个值

[ bold? smaller? ]!

规范SpecificationCSS Values and Units Module Level 4 # value-defs参见

CSS 重要概念:

CSS 语法

@ 规则

注释

优先级

继承

盒模型

布局模式

视觉格式化模型

外边距合并

初始值

计算值

解析值

指定值

应用值

实际值

属性值定义语法

简写属性

可替换元素

Copyright © 2022 篮球世界杯_世界杯亚洲区名额 - cdbnfc.com All Rights Reserved.