Thuộc tính Transform trong CSS
Thuộc tính
Các giá trị thường dùng của
transform trong CSS cho phép bạn thay đổi kích thước, hình dạng và vị trí của các phần tử HTML một cách linh hoạt. Đây là một công cụ mạnh mẽ để tạo hiệu ứng trực quan mà không làm thay đổi cấu trúc thực tế của phần tử trong tài liệu HTML.
Cú pháp cơ bản
Cú pháp của thuộc tính transform rất đơn giản:
element {
transform: giá trị;
}
Các giá trị thường dùng của transform
- translate(x, y): Di chuyển phần tử theo trục X và Y.
- scale(x, y): Thay đổi kích thước của phần tử theo tỉ lệ trên trục X và Y.
- rotate(angle): Xoay phần tử theo một góc nhất định, tính bằng độ.
- skew(x-angle, y-angle): Làm nghiêng phần tử theo trục X và Y.
- matrix(a, b, c, d, e, f): áp dụng một ma trận biến đổi để thực hiện nhiều phép biến đổi 2D cùng lúc.