<angle>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Kiểu dữ liệu <angle> CSS kiểu dữ liệu biểu diễn một giá trị góc được biểu thị bằng độ, gradian, radian, hoặc vòng. Nó được dùng, ví dụ, trong <gradient> và trong một số hàm transform.

Try it

transform: rotate(45deg);

transform: rotate(3.1416rad);

transform: rotate(-50grad);

transform: rotate(1.75turn);

<section class="default-example" id="default-example">
  <div class="transition-all" id="example-element">
    This box can rotate to different angles.
  </div>
</section>

#example-element {
  background-color: #0118f3;
  padding: 0.75em;
  width: 180px;
  height: 120px;
  color: white;
}

Kiểu dữ liệu <angle> bao gồm một <number> theo sau là một trong các đơn vị được liệt kê bên dưới. Như với mọi kích thước, không có khoảng cách giữa đơn vị và số. Đơn vị góc là tùy chọn sau số 0.

Tùy chọn, giá trị có thể được đứng trước bởi một dấu + hoặc -. Các số dương biểu diễn góc theo chiều kim đồng hồ, trong khi các số âm biểu diễn góc ngược chiều kim đồng hồ. Đối với các thuộc tính tĩnh của một đơn vị nhất định, bất kỳ góc nào cũng có thể được biểu diễn bằng các giá trị tương đương khác nhau. Ví dụ, 90deg bằng -270deg, và 1turn bằng 4turn. Đối với các thuộc tính động, như khi áp dụng animation hoặc transition, hiệu ứng vẫn sẽ khác nhau.

Đơn vị

deg: Biểu diễn góc theo độ. Một vòng tròn đầy đủ là 360deg. Ví dụ: 0deg, 90deg, 14.23deg.
grad: Biểu diễn góc theo gradian. Một vòng tròn đầy đủ là 400grad. Ví dụ: 0grad, 100grad, 38.8grad.
rad: Biểu diễn góc theo radian. Một vòng tròn đầy đủ là 2π radian xấp xỉ 6.2832rad. 1rad là 180/π độ. Ví dụ: 0rad, 1.0708rad, 6.2832rad.
turn: Biểu diễn góc theo số vòng. Một vòng tròn đầy đủ là 1turn. Ví dụ: 0turn, 0.25turn, 1.2turn.