বিবরণ
DOM-এর paddingTop প্রোপার্টি ব্যবহার করা হয় HTML-এ একটি এলিমেন্টের উপরের প্যাডিং সেট করার জন্য। মনে রাখবেন, এটি একটি এলিমেন্টের বর্ডারের ভেতরে স্পেস যোগ করে। এটি উপরের প্যাডিং রিটার্ন করার জন্যও ব্যবহার করা হয়। ডিফল্ট মান ০।
সিনট্যাক্স
নিচে সিনট্যাক্স দেওয়া হলো:
- উপরের প্যাডিং রিটার্ন করার সিনট্যাক্স
object.style.paddingTop
- উপরের প্যাডিং সেট করার সিনট্যাক্স
object.style.paddingTop = "%|length|initial|inherit"
এখানে, % হলো উপরের প্যাডিং, length হলো প্যাডিং দৈর্ঘ্যে (ইউনিটসহ), initial প্রোপার্টিকে ডিফল্ট মান সেট করতে ব্যবহৃত হয় এবং inherit প্যারেন্ট এলিমেন্ট থেকে প্রোপার্টি উত্তরাধিকার করতে ব্যবহৃত হয়।
উদাহরণ
আইয়ে এখন paddingTop প্রোপার্টি ইমপ্লিমেন্ট করার একটি উদাহরণ দেখি:
<!DOCTYPE html> <html> <head> <style> #sample { border: 2px dashed #ded575; } </style> </head> <body> <div id="sample">Demo text!</div> <br> <button type="button" onclick="demo()">Update</button> <script> function demo() { document.getElementById("sample").style.paddingTop = "80px"; } </script> </body> </html>
আউটপুট
এটি নিচের আউটপুট তৈরি করবে:
উপরের Update বাটনে ক্লিক করলে নিচেরটি দেখা যাবে। আমরা এখন সহজে উপরের প্যাডিং সেট করেছি padding-top প্রোপার্টি ব্যবহার করে:
