HTML DOM borderRightColor প্রপার্টি একটি এলিমেন্টের ডান বর্ডারের রঙ পাওয়া বা সেট করার জন্য ব্যবহৃত হয়।
সিনট্যাক্স
borderRightColor প্রপার্টি সেট করার সিনট্যাক্স:
object.style.borderRightColor = "color|transparent|initial|inherit"
প্রপার্টি মানগুলো নিচে ব্যাখ্যা করা হলো:
| মান | বিবরণ |
|---|---|
| color | ডান বর্ডার রঙ নির্দিষ্ট করতে ব্যবহৃত হয়। এর ডিফল্ট রঙ কালো। |
| transparent | ডান বর্ডারকে স্বচ্ছ করে দেয় যাতে নিচের কন্টেন্ট দেখা যায়। |
| initial | প্রপার্টিকে ডিফল্ট মানে সেট করার জন্য। |
| inherit | পিতামাতা এলিমেন্ট থেকে মান উত্তরাধিকার সূত্রে পাওয়ার জন্য। |
উদাহরণ
<!DOCTYPE html> <html> <head> <style> #IMG1 { border-right:solid 8px; border-right-color: orange; } </style> <script> function changeBorderRight(){ document.getElementById("IMG1").style.borderRightColor="lightgreen"; document.getElementById("Sample").innerHTML="ডান বর্ডার রঙ এখন সবুজে পরিবর্তিত হয়েছে"; } </script> </head> <body> <img id="IMG1" src="https://www.tutorialspoint.com/blue_prism/images/blueprism-logo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=550&w=150 "> <p>নিচের বাটনে ক্লিক করলে উপরের ইমেজের ডান বর্ডার রঙ পরিবর্তন হবে</p> <button onclick="changeBorderRight()">বর্ডার রঙ পরিবর্তন করুন</button> <p id="Sample"></p> </body> </html>
আউটপুট
বর্ডার রঙ পরিবর্তন করুন বাটনে ক্লিক করলে:
উপরোক্ত উদাহরণে:
আমরা "IMG1" আইডি সহ একটি ইমেজ এলিমেন্ট তৈরি করেছি যার CSS স্টাইল প্রয়োগ করা হয়েছে। CSS স্টাইলে ডান বর্ডার শৈলী এবং ডান বর্ডার রঙ নির্দিষ্ট করা হয়েছে।
#IMG1 { border-right:solid 8px; border-right-color: orange; } <img id="IMG1" src="https://www.tutorialspoint.com/blue_prism/images/blueprism-logo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=550&w=150 ">
তারপর বর্ডার রঙ পরিবর্তন করুন নামে একটি বাটন তৈরি করা হয়েছে যা ক্লিক করলে changeBorderRight() মেথড এক্সিকিউট হবে।
<button onclick="changeBorderRight()">বর্ডার রঙ পরিবর্তন করুন</button>
changeBorderRight() মেথড getElementById() মেথড ব্যবহার করে "IMG1" আইডি সহ <img> এলিমেন্টটি পায় এবং এর borderRightColor স্টাইল প্রপার্টিকে lightgreen সেট করে। এটি ডান বর্ডার রঙকে lightgreen-এ পরিবর্তন করে এবং এই পরিবর্তনটি "Sample" আইডি সহ প্যারাগ্রাফে এর innerHTML প্রপার্টি ব্যবহার করে প্রদর্শন করে।
function changeBorderRight(){ document.getElementById("IMG1").style.borderRightColor="lightgreen"; document.getElementById("Sample").innerHTML="ডান বর্ডার রঙ এখন সবুজে পরিবর্তিত হয়েছে"; }
