HTML DOM শৈলী শীর্ষ সম্পত্তি একটি HTML নথিতে একটি অবস্থানযুক্ত HTML উপাদানের শীর্ষ অবস্থান ফেরত দেয় এবং সংশোধন করে৷
সিনট্যাক্স
নিচের সিনট্যাক্স −
1. শীর্ষে ফিরে আসা
object.top
2. শীর্ষ সংশোধন করা হচ্ছে
object.top = “value”
এখানে, মান −
হতে পারেSr. No | মান ও ব্যাখ্যা |
---|---|
1 | প্রাথমিক এটি এই সম্পত্তির মানটিকে তার ডিফল্ট মানতে সেট করে৷ | ৷
2 | উত্তরাধিকার এটি তার মূল উপাদান থেকে এই সম্পত্তি মান উত্তরাধিকারসূত্রে পায়৷ | ৷
3 | শতাংশ(%) এটি মূল উপাদানের প্রস্থের শতাংশে মান নির্ধারণ করে। |
4 | দৈর্ঘ্য এটি দৈর্ঘ্যের এককের শীর্ষে মান নির্ধারণ করে। |
5 | স্বয়ংক্রিয় এটি ব্রাউজারটিকে শীর্ষ অবস্থানের মান সেট করতে দেয়৷ | ৷
আসুন HTML DOM Style top Property -
-এর একটি উদাহরণ দেখিউদাহরণ
<!DOCTYPE html> <html> <style> body { color: #000; height: 100vh; } .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; margin: 1rem 0; } .square { width: 100px; height: 100px; background: #db133a6b; position: relative; } .show { font-size: 1.2rem; margin: 1rem 0; } </style> <body> <h1>DOM Style top Property Demo</h1> <div class='square'></div> <button onclick="set()" class="btn">Set top position</button> <script> function set() { document.querySelector('.square').style.top = "200px"; } </script> </body> </html>
আউটপুট
“সেট টপ পজিশন-এ ক্লিক করুন ” গোলাপী বর্গক্ষেত্রের শীর্ষ অবস্থান সেট করতে বোতাম।