Bạn có thể lật hình ảnh bằng CSS! Tình huống có thể xảy ra: chỉ có một hình ảnh cho một “mũi tên”, nhưng lật nó xung quanh để trỏ theo các hướng khác nhau.
.flip-horizontally ( transform: scaleX(-1); )
Xem cách một mũi tên được sử dụng để trỏ cả hai hướng tại đây:
Xem Pen
Flip an Image by CSS-Tricks (@ css-trick)
trên CodePen.
Xoay vòng là một khả năng khác, có nghĩa là một mũi tên của chúng ta có thể đi nhiều hướng:
Xem Pen
Flip an Image by CSS-Tricks (@ css-trick)
trên CodePen.
Đây cũng là bất kỳ hình ảnh nào, hoặc thực sự là bất kỳ phần tử nào.
Xem Pen
Flip an Image by CSS-Tricks (@ css-trick)
trên CodePen.
Tiền tố nhà cung cấp cũ
Đối với hậu thế:
img ( -webkit-transform: scaleX(-1); -moz-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; )