角度
- <angle>
-
可以用两种办法指定角度。如果用在样式表的属性的值中,
<angle>
可以用如下方法定义:angle ::= number (~"deg" | ~"grad" | ~"rad")?
在这里deg标识了度数,grad标识了斜率,rad标识了弧度。
对于定义在CSS2中的属性,必须提供一个角度单位标识符。对于在SVG特有的属性和它们对应的外观属性中的角度值,角度单位标识符是可选的。如果没有提供,角度值会被潜在分配一个度数单位。在所有元素的外观属性中,无论是在SVG1.1中定义的,还是在CSS2中定义的,如果指定了角度标识符,角度标识符必须是小写的。
如果角度用在一个SVG属性中,
<angle>
可以用以下方式定义:angle ::= number ("deg" | "grad" | "rad")?
在这个<angle>值中,单位标识符必须是小写的。
在SVG DOM中,<angle>值使用
SVGAngle
或SVGAnimatedAngle objects
表达。
任意值
- <anything>
-
基本类型<anything>是一个零字符或多字符的序列。具体如下:
anything ::= Char*
在这里,Char 表示一个字符,XML 1.0 第2.2节中定义了它。
时钟值
- <clock-value>
-
时钟值的句法与SMIL Animation规范中写的句法相同。在这里重放一下时钟值的语法:
Clock-val ::= Full-clock-val | Partial-clock-val | Timecount-val Full-clock-val ::= Hours ":" Minutes ":" Seconds ("." Fraction)? Partial-clock-val ::= Minutes ":" Seconds ("." Fraction)? Timecount-val ::= Timecount ("." Fraction)? (Metric)? Metric ::= "h" | "min" | "s" | "ms" Hours ::= DIGIT+; any positive number Minutes ::= 2DIGIT; range from 00 to 59 Seconds ::= 2DIGIT; range from 00 to 59 Fraction ::= DIGIT+ Timecount ::= DIGIT+ 2DIGIT ::= DIGIT DIGIT DIGIT ::= [0-9]
对于
Timecount
值,默认的公制前缀是“s”(秒)。在时钟值中不能嵌入空白,而且前导和末尾的空白字符会被忽略掉。下面是合法的时钟值的示例:
- 完整时钟值:
02:30:03
= 2小时30分钟又3秒
50:00:10.25
= 50小时10秒又250毫秒 - 部分时钟值:
02:33
= 2分钟又33秒
00:10.5
= 10.5 秒 = 10秒又500毫秒 - Timecount值:
3.2h
= 3.2小时 = 3小时12分钟
45min
= 45分钟
30s
= 30秒
5ms
= 5毫秒
12.467
= 12秒又467毫秒
小数值是基数为10的浮点数,秒的界定。因此:
00.5s = 500毫秒
00:00.005 = 5毫秒 - 完整时钟值:
颜色
- <color>
-
基本类型<color>是一个CSS2兼容的规范,针对sRGB颜色空间的颜色。<color>应用在SVG的属性
color
上,也是属性fill
、属性stroke
、属性stop-color
、属性flood-color
和属性lighting-color
的定义的组成部分,<color>还提供了可选的基于ICC的颜色规范。SVG支持所有的定义在CSS2句法和基本数据类型中的<color>供选择的句法,而且还支持CSS Color Module Level 3中的<color>句法(取决于编译器)。
一个<color>可以是一个关键词,或者一个数字化的RGB规范。
除了这些颜色关键词,用户可以利用用户环境中的对象指定对应于颜色的关键词。 这些关键词的规范定义可以在用户对颜色的引用(CSS2规范第18.2节)中找到。
一个16进制记号法的RGB值的格式是一个“#”后面紧跟着3个或者6个16进制字符。三数字RGB记号法(#rgb)可以转换成六数字RGB格式(#rrggbb),只需要复制数字,而不是添加0。举个例子,#fb0扩展为#ffbb00。这样确保白色(#ffffff)可以用缩写记法#fff指定,去掉任何对显示器的色深的依赖。一个函数记号法的RGB值的格式是一个RGB开头函数后面跟着一个逗号分隔的三数值数列(可以是三个数字或者三个百分数)后面跟着一个右括号“)”。一个RGB开头函数是一个大小写不敏感的字符串“rgb(”,举个例子,“RGB(”或者“rGb(”。为了兼容性,建议使用全小写形式“rgb(”。整型值255对应于100%,也对应于16进制计号法中的F或FF:
rgb(255,255,255)
=rgb(100%,100%,100%)
=#FFF。数字值周围允许存在空白字符。所有的RGB值都指定在sRGB颜色空间里。使用sRGB提供了一个清楚的、客观的、可测量的颜色定义,可以关联到国际标准。
color ::= "#" hexdigit hexdigit hexdigit (hexdigit hexdigit hexdigit)? | "rgb("integer, integer, integer")" | "rgb("integer "%", integer "%", integer "%)" | color-keyword hexdigit ::= [0-9A-Fa-f]
在这里,color-keyword要于匹配列于CSS Color Module Level 3中的颜色关键词(大小写不敏感)中的一个,要么匹配列于对颜色的用户参考中的一个。
SVG DOM对<color>的定义,CSS中也做了同样的定义。SVG对颜色的扩展,包括指定基于ICC的颜色的能力,可以使用DOM接口
SVGColor
来表现。
坐标
- <coordinate>
-
一个<coordinate>是一个用户坐标系统中的长度,是从用户坐标系统的原点沿着相关轴走出给定的距离(X轴针对X坐标,Y轴针对Y坐标)。它的句法与<length>相同。
在SVG DOM内部,一个 <coordinate> 代表了一个
SVGLength
或者一个SVGAnimatedLength
.
频率
- <frequency>
-
频率值用在可听到的属性上。就如CSS2中所定义的,一个频率值是一个<number>后面跟着一个频率单位标识符。频率单位标识符可以是:
Hz:赫兹
kHz
:千赫
频率值不能是负数。
FuncIRI
- <FuncIRI>
- 用于引用的功能记号法,该引用的句法与
css uri
相同。
ICC颜色
- <icccolor>
-
<icccolor> 一份ICC颜色规范。在SVG 1.1,一份ICC颜色规范,顾名思义,是一个参考了一个
<color-profile>
元素,以及一个或更多颜色成分值。语法如下所示:icccolor ::= "icc-color(" name (, number)+ ")"
<icccolor>对应的SVG DOM接口是
SVGICCColor
。
整型数
- <integer>
-
用一个可选的正负符号(“+”或“-”)后面跟着一个或多个0到9的数字可以指定一个<integer>:
integer ::= [+-]? [0-9]+
如果正负符号不出现,则这个数字是非负的。
除非是另有声明为特殊的属性,<integer>的范围是-2147483648到2147483647之间。
在SVG DOM内部,一个<integer>代表了一个数字或者一个
SVGAnimatedInteger
。
IRI
- <IRI>
-
一个国际化资源标识符。
在因特网上,资源是用IRI(一个国际化资源标识符)标识的。举个例子,一个SVG文档调用了位于https://example.com上的someDrawing.svg,可以使用下面的IRI:
https://example.com/someDrawing.svg
一个IRI中包含一个IRI片段标识符,就可以定位一个XML文档内部的特定的元素。一个包含有IRI片段标识符的IRI,由一个可选的基础IRI后面跟着一个“#”号,再跟着一个IRI片段标识符组成。举个例子,下面的IRI可以用来指定文件someDrawing.svg中的ID为“Lamppost”的元素:
https://example.com/someDrawing.svg#Lamppost
IRIs用在
xlink:href
属性中。有些属性既允许IRI作为内容,也允许文本字符串。为了消除歧意,避免一个文本字符串被当作IRI,可以使用功能记号法<FuncIRI>。这只是简单用功能记号法分隔一个IRI。注意:出于历史原因,为了与CSS规范兼容,分隔符是“url(”和“)”。该FuncIRI格式用在外观属性中。SVG广泛地使用了IRI引用,引用对象既可以是绝对引用也可以是引对引用。举个例子,要用线性渐变填充一个矩形,你可以先定义一个
<linearGradient>
元素,然后给它一个ID,如下:<linearGradient xml:id="MyGradient">...</linearGradient>
然后你再引用这个线性渐变,作为矩形的属性
fill
的值,如下:<rect fill="url(#MyGradient)"/>
SVG支持两种类型的IRI 引用:
- 本地IRI引用,在这里IRI引用不能包含一个
<absoluteIRI>
或<relativeIRI>
,因此只能包含一个片段标识符(例如:#<elementID>
或者#xpointer(id<elementID>))。
- 非本地IRI引用,在这里IRI引用必须包含一个
<absoluteIRI>
或<relativeIRI>。
欲了解完整的SVG中的IRI引用的规范请阅读SVG 1.1 (2nd Edition): IRI references。
- 本地IRI引用,在这里IRI引用不能包含一个
长度
- <length>
-
一个长度是一个可度量的距离,给定一个数字以及一个单位。长度可以用两种方法指定。如果在样式表中使用它,可以如下定义<length>:
length ::= number (~"em" | ~"ex" | ~"px" | ~"in" | ~"cm" | ~"mm" | ~"pt" | ~"pc")?
请阅读CSS2规范 以了解单位标识符的意义。
在CSS2中定义的长度属性,必须提供单位标识符。而SVG专用属性的长度值以及它们对应的外观属性,长度单位标识符是可选的。如果没有提供单位标识符,长度值代表当前用户坐标系统中的一段距离。对于外观属性,无论是定义在SVG1.1还是定义在CSS2中,长度单位标识符必须是小写的。
如果是在SVG属性中使用长度,<length>需定义如下:
length ::= number ("em" | "ex" | "px" | "in" | "cm" | "mm" | "pt" | "pc" | "%")?
在这样的<length>值中,单位标识符必须是小写的。
注意,非属性<length>定义同样允许百分比单位标识符。这意味着一个百分比长度值依赖于被指定百分比长度值的属性。分两种情况:
- 百分比长度值表达了一个视口宽度或高度的百分比;
- 百分比长度值表达了一个给定对象上的边界盒的宽度或高度的百分比。
在SVG DOM中,<length>值可以用{domxref("SVGLength")}}对象或
SVGAnimatedLength
对象来表达。
T值数列
- <list-of-Ts>
-
(在这里T 某些类型。)由一系列分开的值构成的数列。除非另有说明,SVG的XML属性内的数列既可以是逗号分隔的,也可以是空格分隔的。用逗号作分隔符,逗号前面或后面可有带空格。
数列中的空白被定义为一个或多个下列连续字符:“空格” (U+0020)、“制表符” (U+0009)、 “换行符” (U+000A)、 “回车符” (U+000D)以及“换页符”(U+000C)。
下面是一个EBNF语法的模板,用来描述<list-of-Ts>句法:
list-of-Ts ::= T | T, list-of-Ts
在SVG DOM内部,<list-of-Ts>类型的值可以用一个限特定类型T的接口来表达。举个例子,SVG DOM中的<list-of-lengths>使用一个
SVGLengthList
对象或者SVGAnimatedLengthList
对象来表达。
命名
- <name>
-
一个命名,是一个字符串,是不符合句法意义的少量的字符。
name ::= [^,()#x20#x9#xD#xA] /* 除了",", "(", ")" 或 wsp 之外的任何字符 */
数字
- <number>
-
真实数字可以用两种方法指定。如果用在样式表中,一个<number>可以如下定义:
number ::= integer | [+-]? [0-9]* "." [0-9]+
该句法与CSS(CSS2第4.3.1章节)中的定义一样。
如果用在一个SVG属性中,一个<number>可以用别的方法定义,允许一个数字后面跟着大数指数,以指定得更精确:
number ::= integer ([Ee] integer)?| [+-]? [0-9]* "." [0-9]+ ([Ee] integer)?
在SVG DOM内部,一个<number>可以用浮点数、
SVGNumber
对象或者SVGAnimatedNumber
对象来表达。
带可取舍的后缀数字的数字
- <number-optional-number>
-
一对<number>,其中第二个<number>是可视情况取舍的。
number-optional-number ::= number | number, number
在SVG DOM中,一个<number-optional-number>可以用一对
SVGAnimatedInteger
对象或者一对SVGAnimatedNumber
对象来表达。
不透明度值
- <opacity-value>
- 颜色不透明度或者当前对象填充的内容的不透明度,它是一个<number>。任何超出0.0到1.0范围的值将被压制回这个范围。0.0表示完全透明,1.0表示完全不透明。
涂色
- <paint>
-
属性
fill
和属性stroke
的值,是涂色类型的规范,用在要对一个给定元素填充或描边的时候。SVG规范的Specifying paint章节中描述了<paint>可用的选项以及句法。在SVG DOM内部,<paint>值用
SVGPaint
对象表达。
百分数
- <percentage>
-
一个数字后面跟着一个百分号“%”就可以指定一个百分数。
percentage ::= number "%"
注意<number>的意义取决于百分数是在一个样式表中指定的,还是在一个SVG属性非外观属性中指定的。
百分数值总是关联到另一个值。举个例子,每种允许百分比的属性同时定义了引用了给百分比数参考的距离测量。
在SVG DOM内部,<percentage>用
SVGNumber
对象或SVGAnimatedNumber
对象表达。
时间
- <time>
-
一个时间值是一个<number>后面紧跟着时间单位标识符。时间单位标识符可以是:
- ms:毫秒
- s:秒
平移数列
- <transform-list>
-
一个<transform-list>是用来指定一个坐标系统转换数列。属性
transform
的定义中给出了<transform-list>的可用值的详细描述。在SVG DOM内部,一个<transform-list>值是用了一个
SVGTransformList
对象或者SVGAnimatedTransformList
对象来表达的。