কম্পিউটার

CSS translate() ফাংশন


CSS-এ translate() ফাংশনটি একটি উপাদানকে অনুভূমিক এবং উল্লম্ব দিক থেকে পুনরায় অবস্থান করতে ব্যবহৃত হয়।

উদাহরণ

আসুন এখন একটি উদাহরণ দেখি -

<!DOCTYPE html>
<html>
<head>
<style>
#demo1 {background-color: hsla(140, 100%, 50%, 0.8);}
#demo2 {background-color: hsla(130, 100%, 50%, 0.6);}
.translate_img {
   transform: translate(50px, 0);
}
</style>
</head>
<body>
<h1>Learn</h1>
<p id="demo1">Excel vlookup</p>
<p id="demo2">Excel filters</p>
<h4>Learn Excel</h4>
<img class="translate_img" src=
"https://www.tutorialspoint.com/videotutorials/assets/videos/courses/42/images/course_42_image.png"
alt="MS Excel">
</body>
</html>

আউটপুট

CSS translate() ফাংশন

উদাহরণ

এখন আরেকটি উদাহরণ দেখা যাক -

<!DOCTYPE html>
<html>
<head>
<style>
.translate_img {
   transform: translate(100px, 50%);
}
</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">
</body>
</html>

আউটপুট

CSS translate() ফাংশন


  1. CSS3 rotate3d() ফাংশন

  2. CSS ব্যবহার করে ব্যাকগ্রাউন্ড পজিশন সেট করা

  3. CSS ব্যবহার করে ব্যাকগ্রাউন্ড কালার সেট আপ করা হচ্ছে

  4. এইচটিএমএল এবং সিএসএসের জন্য শিক্ষানবিস গাইড