Jūs varat uzsist attēlus, izmantojot CSS! Iespējamais scenārijs: “bultiņai” ir tikai viena grafika, bet tā tiek pagriezta apkārt, lai norādītu dažādos virzienos.
.flip-horizontally ( transform: scaleX(-1); )Skatiet, kā vienu bultiņu izmanto, lai norādītu abus virzienus šeit:
Skatiet
CSS-Tricks (@ css-tricks) pildspalvu Flip a Image
vietnē CodePen.
Rotācija ir vēl viena iespēja, kas nozīmē, ka mūsu viena bulta varētu iet daudzos virzienos:
Skatiet
CSS-Tricks (@ css-tricks) pildspalvu Flip a Image
vietnē CodePen.
Arī tas ir jebkurš attēls vai vispār jebkurš elements.
Skatiet
CSS-Tricks (@ css-tricks) pildspalvu Flip a Image
vietnē CodePen.
Veco piegādātāju prefiksi
Pēcnācējiem:
img ( -webkit-transform: scaleX(-1); -moz-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; )