एक छवि पलटें - सीएसएस-ट्रिक्स

आप सीएसएस के साथ छवियों को फ्लिप कर सकते हैं! संभावित परिदृश्य: एक "तीर" के लिए केवल एक ग्राफिक होना, लेकिन इसे अलग-अलग दिशाओं में इंगित करने के लिए चारों ओर फ़्लिप करना।

.flip-horizontally ( transform: scaleX(-1); )

देखें कि दोनों दिशाओं को इंगित करने के लिए एक तीर का उपयोग कैसे किया जाता है:

CodePen पर
CSS-Tricks (@ css-tricks) द्वारा पेन फ्लिप इमेज देखें
।

रोटेशन एक और संभावना है, जिसका अर्थ है कि हमारा एक तीर बहुत दिशाओं में जा सकता है:

CodePen पर
CSS-Tricks (@ css-tricks) द्वारा पेन फ्लिप इमेज देखें
।

यह किसी भी छवि, या वास्तव में किसी भी तत्व है।

CodePen पर
CSS-Tricks (@ css-tricks) द्वारा पेन फ्लिप इमेज देखें
।

पुराने विक्रेता उपसर्ग

पोस्टरिटी के लिए:

img ( -webkit-transform: scaleX(-1); -moz-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; )