skew() ফাংশন ২D সমতলে একটি এলিমেন্টকে কোণাকার (skew) করতে ব্যবহৃত হয়। প্যারামিটার হিসেবে X এবং Y অক্ষের কোণ দেওয়া হয়।
উদাহরণ ১: X-अক্ষে ৪৫ ডিগ্রি Skew
<!DOCTYPE html> <html> <head> <style> .translate_img { transform: translate(50px, 10%); } .skew_img { transform-origin: top left; transform: skew(45deg, 0); } </style> </head> <body> <h1>Learn</h1> <img class="translate_img" src="https://www.tutorialspoint.com/numpy/images/numpy-mini-logo.jpg" alt="Numpy"> <img class="skew_img" src="https://www.tutorialspoint.com/apache_spark/images/apache-spark-mini-logo.jpg" alt="Apache Spark"> </body> </html>
আউটপুট
উদাহরণ ২: ভিন্ন একক ব্যবহার (turn এবং deg)
<!DOCTYPE html> <html> <head> <style> .translate_img { transform: translate(50px, 10%); } .skew_img { transform-origin: top left; transform: skew(-0.06turn, 18deg); } </style> </head> <body> <h1>Learn</h1> <img class="translate_img" src="https://www.tutorialspoint.com/numpy/images/numpy-mini-logo.jpg" alt="Numpy"> <img class="skew_img" src="https://www.tutorialspoint.com/apache_spark/images/apache-spark-mini-logo.jpg" alt="Apache Spark"> </body> </html>
আউটপুট
প্যারামিটার
- ax (X-axis skew): হরিজন্টাল কোণ (deg, grad, rad, turn)
- ay (Y-axis skew): ভার্টিক্যাল কোণ (ঐচ্ছিক, ডিফল্ট ০)
transform-origin: ডিফল্টভাবে কেন্ডার (center) থেকে skew হয়। top left সেট করলে উপরের বাম কোণা থেকে skew হয়।
সংযোগ: skewX() এবং skewY() আলাদা ফাংশন হিসেবেও রয়েছে।
