ফাংশন rotateX
ফাংশন rotateX ত্রিমাত্রিক স্থানে X অক্ষের সাপেক্ষে ঘূর্ণন নির্দিষ্ট করে।
এটি transform বৈশিষ্ট্যের সাথে একত্রে ব্যবহার করা হয়।
বৈশিষ্ট্যের মান হল কোনও কোণের একক এ কোণ।
ধনাত্মক মান আমাদের দিকে ঘোরায়, ঋণাত্মক মান - আমাদের থেকে দূরে ঘোরায়।
ঘূর্ণন transform-origin
বৈশিষ্ট্য দ্বারা নির্দিষ্ট বিন্দুর চারপাশে সঞ্চালিত হয়।
সিনট্যাক্স
সিলেক্টর {
transform: rotateX(কোণ);
}
উদাহরণ
এই উদাহরণে, ব্লকটি হভার করলে X অক্ষ বরাবর 180 ডিগ্রী ঘুরবে।
ঘূর্ণনের মসৃণতার জন্য transition বৈশিষ্ট্য যোগ করা হয়েছে:
<div id="elem">lorem ipsum</div>
#elem {
border: 3px solid black;
width: 100px;
height: 50px;
transition: transform 3s linear;
}
#elem:hover {
transform: rotateX(180deg);
}
:
উদাহরণ
transform-origin বৈশিষ্ট্য ব্যবহার করে ঘূর্ণনের অক্ষ পরিবর্তন করা যাক:
<div id="elem">lorem ipsum</div>
#elem {
border: 3px solid black;
width: 100px;
height: 50px;
transition: transform 3s linear;
transform-origin: center bottom;
}
#elem:hover {
transform: rotateX(180deg);
}
:
উদাহরণ
একটি ঋণাত্মক কোণ নির্দিষ্ট করা যাক:
<div id="elem">lorem ipsum</div>
#elem {
border: 3px solid black;
width: 100px;
height: 50px;
transition: transform 3s linear;
transform-origin: center bottom;
}
#elem:hover {
transform: rotateX(-180deg);
}
:
