ट्रांसफॉर्म प्रॉपर्टी

प्रॉपर्टी transform एलिमेंट के ट्रांसफॉर्मेशन सेट करती है, जैसे कि रोटेशन, स्केलिंग, तिरछापन, शिफ्टिंग और अन्य। संबंधित ट्रांसफॉर्मेशन स्पेस से अलग करके लिखे जाते हैं:

सेलेक्टर {
	transform: rotate(30deg) scale(3);
}

उदाहरण

इस उदाहरण में ब्लॉक को घड़ी की दिशा में 30 डिग्री से घुमाया गया है:

<div id="elem">lorem ipsum</div>

#elem {
	transform: rotate(30deg);
	border: 1px solid black;
	width: 100px;
	height: 50px;
}

उदाहरण

इस उदाहरण में रोटेशन के अलावा तिरछापन भी जोड़ा गया है:

<div id="elem">lorem ipsum</div>

#elem {
	transform: rotate(30deg) skew(20deg);
	border: 1px solid black;
	width: 100px;
	height: 50px;
}

उदाहरण

इस उदाहरण में रोटेशन और तिरछापन के अलावा स्केल में बदलाव भी जोड़ा गया है:

<div id="elem">lorem ipsum</div>

#elem {
	transform: rotate(30deg) skew(20deg) scale(2, 3);
	border: 1px solid black;
	width: 100px;
	height: 50px;
}