<angle>

Тип даних CSS <angle> (кут) представляє кутове значення, виражене в градусах, градах, радіанах або обертах. Він використовується, наприклад, в градієнтах та частині функцій 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.

Приклади

Задання прямого кута за годинниковою стрілкою

Задання розгорнутого кута

Задання прямого кута проти годинникової стрілки

Задання нульового кута

Специфікації

Сумісність із браузерами

Дивіться також

• Типи даних CSS
• Тип <gradient>
• Перетворення обертання CSS: rotate(), rotate3d(), rotateX(), rotateY() і rotateZ()
• Перетворення CSS
• Застосування перетворень CSS
• Застосування градієнтів CSS