<angle>
Базовая Широкодоступная
Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с сентября 2015 года.
Тип данных <angle> CSS данных представляет собой значение угла, выраженное в градусах, градах, радианах или оборотах. Он используется, например, в <gradient> и в некоторых функциях transform.
Попробовать
Синтаксис
Тип данных <angle> состоит из <number>, за которым следует один из перечисленных ниже единиц. Как и со всеми измерениями, пробел между числом и буквенным обозначением единицы отсутствует. Единица измерения угла необязательна после числа 0.
Необязательно, может быть префикс с одним знаком + или -. Положительные числа представляют углы по часовой стрелке, а отрицательные числа — против часовой стрелки. Для статических свойств заданной единицы любой угол может быть представлен различными эквивалентными значениями. Например, 90deg равно -270deg, а 1turn равно 4turn. Для динамических свойств, таких как применение animation или transition, эффект, тем не менее, будет другим.
Единицы измерения
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.
Примеры
Установка угла по часовой стрелке
 | 90deg = 100grad = 0.25turn ≈ 1.5708rad |
Установка плоского угла
 | 180deg = 200grad = 0.5turn ≈ 3.1416rad |
Установка угла против часовой стрелки
 | -90deg = -100grad = -0.25turn ≈ -1.5708rad |
Установка нулевого угла
 | 0 = 0deg = 0grad = 0turn = 0rad |
Спецификации
| Спецификация |
|---|
| Модуль CSS значений и единиц, уровень 4 # углы |
Совместимость с браузерами
| Рабочий стол | Мобильный | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на IOS | Samsung Internet | WebView Android | |
angle |
2 | 12 | 3.6 | 15 | 4 | 18 | 4 | 14 | 3.2 | 1.0 | 2 |
deg |
2 | 12 | 3.6 | 15 | 4 | 18 | 4 | 14 | 3.2 | 1.0 | 2 |
grad |
2 | 12 | 3.6 | 15 | 4 | 18 | 4 | 14 | 3.2 | 1.0 | 2 |
rad |
2 | 12 | 3.6 | 15 | 4 | 18 | 4 | 14 | 3.2 | 1.0 | 2 |
turn |
2 | 12 | 13 | 15 | 4 | 18 | 14 | 14 | 3.2 | 1.0 | 2 |
См. также
- Типы данных CSS
- Тип
<gradient> - Преобразования вращения CSS:
rotate(),rotate3d(),rotateX(),rotateY()иrotateZ() - Преобразования CSS
- Использование преобразований CSS
- Использование градиентов CSS
© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/angle
