Du kan vända bilder med CSS! Möjligt scenario: att bara ha en grafik för en “pil”, men vända på den för att peka i olika riktningar.
.flip-horizontally ( transform: scaleX(-1); )Se hur en pil används för att peka båda riktningarna här:
Se pennan
vänd en bild av CSS-Tricks (@ css-tricks)
på CodePen.
Rotation är en annan möjlighet, vilket innebär att vår ena pil kan gå många riktningar:
Se pennan
vänd en bild av CSS-Tricks (@ css-tricks)
på CodePen.
Det här är vilken bild som helst eller egentligen något element alls.
Se pennan
vänd en bild av CSS-Tricks (@ css-tricks)
på CodePen.
Gamla leverantörsprefix
För eftertiden:
img ( -webkit-transform: scaleX(-1); -moz-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; )