Font Awesome là bộ CSS cho phép bạn tạo ra các icon sử dụng trong khi thiết kế website mà không cần dùng đến hình ảnh. Đối với các icon, thông thường Font Awesome sẽ hỗ trợ cho bạn theo nhiều hướng khác nhau, ví dụ icon dấu mũi tên thì sẽ có hướng bên trái, hướng bên phải, hướng lên trên, hướng xuống dưới,… Nhưng bây giờ bạn muốn sử dụng một icon nào đó mà chỉ hỗ trợ 1 hướng, giờ bạn muốn quay icon đó theo chiều ngược lại thì bạn sử dụng css như mình hướng dẫn bên dưới.
Trong tập tin .css của giao diện, bạn dùng thuộc tính theo đúng như chỗ bạn cần chỉnh sửa, ở đây mình sẽ ví dụ là thẻ i với class là fa-truck.
i.fa-truck {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-o-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
transform: rotateY(180deg);
}
Sau khi bạn khai báo như bên trên thì các chiếc xe sẽ quay theo chiều từ trái sang phải thay vì từ phải sang trái như ban đầu, bạn có thể xem kết quả như hình ảnh demo bên dưới.
Ngoài kiểu quay ngược lại, bạn hoàn toàn có thể thay đổi góc quay trong thuộc tính rotate, đôi lúc bạn cần hình quay lên, quay xuống hoặc quay góc 45 độ thì bạn cũng có thể làm được. Chúc bạn thành công.
