কম্পিউটার টিউটোরিয়াল

CSS3 scale() ফাংশন


CSS-এ scale() ফাংশন ২D সমতলে একটি এলিমেন্ট রিসাইজ করার ট্রান্সফরমেশন সংজ্ঞায়িত করতে ব্যবহৃত হয়। scale() ফাংশনের প্যারামিটার হিসেবে প্রতিটি দিকে স্কেলিংের পরিমাণ সেট করুন।

উদাহরণ

<!DOCTYPE html>
<html>
<head>
<style>
.translate_img { transform: translate(100px, 10%); }
.scale_img { transform: scale(1.2); background-color: yellow; }
</style>
</head>
<body>
<h1>Learn</h1>
<img class="translate_img" src="https://www.tutorialspoint.com/videotutorials/assets/videos/courses/509/images/course_509_image.png" alt="MongoDB">
<img class="scale_img" src="https://www.tutorialspoint.com/videotutorials/assets/videos/courses/509/images/course_509_image.png" alt="MongoDB">
</body>
</html>

আউটপুট

CSS3 scale() ফাংশন

উদাহরণ

আরেকটি উদাহরণ:

<!DOCTYPE html>
<html>
<head>
<style>
.translate_img { transform: translate(100px, 10%); }
.scale_img { transform: scale(0.3); }
</style>
</head>
<body>
<h1>Learn</h1>
<img class="translate_img" src="https://www.tutorialspoint.com/videotutorials/assets/videos/courses/509/images/course_509_image.png" alt="MongoDB">
<img class="scale_img" src="https://www.tutorialspoint.com/videotutorials/assets/videos/courses/509/images/course_509_image.png" alt="MongoDB">
</body>
</html>

আউটপুট

CSS3 scale() ফাংশন


  1. CSS3 scale3d() ফাংশন ব্যবহার

  2. CSS skew() ফাংশন ব্যবহার

  3. CSS matrix() ফাংশন ব্যবহার

  4. CSS translate() ফাংশন দিয়ে এলিমেন্ট হরিজেন্টাল ও ভার্টিক্যাল সরানো