CSS参考手册
值和单位 | Values & Units
角度 |
CSS数据类型<angle>
用于表示角的大小,单位为度(degrees)、 百分度(gradians)、弧度(radians)或圈数(turns)。在<gradient>
和transform
的某些方法等场景中有所应用。
<angle>
可以使用+
或-
开头。正数表示顺时针的角,负数表示逆时针的角。对于静态的角,同样的角度可以使用任意等效的值表示。比如90deg
等于 -270deg
,1turn
等于 4turn
。而对于动态的角,比如应用了animation
或transition
时,显示效果则不一样。
语法
<angle>
数据类型由<number>
和下列单位组成。数字与单位之间没有空格。数字为0时,单位可以省略。
单位
deg
——度。一个完整的圆是360deg
。例:0deg
,90deg,14.23deg
。
grad
——百分度。一个完整的圆是400grad
。例:0grad
,100grad
,38.8grad
。
rad
——弧度。一个完整的圆是 2π 弧度,约等于 6.2832rad
。1rad
是 180/π 度。例:0rad
,1.0708rad
,6.2832rad
。
turn
——圈数。一个完整的圆是1turn
。例:0turn
,0.25turn
,1.2turn
。
实例
|
A right angle: 90deg = 100grad = 0.25turn ≈ 1.5708rad |
---|---|
|
A flat angle: 180deg = 200grad = 0.5turn≈ 3.1416rad |
|
A right angle (counterclockwise): -90deg = -100grad = -0.25turn ≈ -1.5708rad |
|
A null angle: 0 = 0deg = 0grad = 0turn = 0rad |
规范
Specification |
Status |
Comment |
---|---|---|
CSS Values and Units Module Level 3The definition of '<angle>' in that specification. |
Candidate Recommendation |
Initial definition. |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support |
2 (528.17) |
(Yes) |
3.6 (1.9.2) |
9.0 |
(Yes) |
4.0 (528.17) |
turn unit |
(Yes) |
(Yes) |
13.0 |
9.0 |
(Yes) |
10 |
Feature |
Android |
Chrome |
Edge |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
---|---|---|---|---|---|---|---|
Basic support |
? |
(Yes) |
(Yes) |
(Yes) |
? |
No support |
? |
turn unit |
No support |
(Yes) |
(Yes) |
13.0 |
? |
No support |
No support |
值和单位 | Values & Units相关
层叠样式表( Cascading Style Sheets )是一种用来表现 HTML 或 XML 等文件样式的计算机语言。CSS 不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。