কম্পিউটার

HTML DOM শৈলী বর্ডার রাইট কালার প্রপার্টি


HTML DOM বর্ডারRightColor প্রপার্টিটি একটি উপাদানের ডান সীমানার জন্য রঙ পেতে বা সেট করতে ব্যবহৃত হয়।

-এর সিনট্যাক্স নিচে দেওয়া হল

বর্ডার রাইট কালার প্রপার্টি −

সেট করা হচ্ছে
object.style.borderRightColor = "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="The border Right color is now changed to green";
   }
</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>Change the above image border Right color by clicking the below button</p>
<button onclick="changeBorderRight()">Change Border Color</button>
<p id="Sample"></p>
</body>
</html>

আউটপুট

HTML DOM শৈলী বর্ডার রাইট কালার প্রপার্টি

সীমানার রঙ পরিবর্তন করুন এ ক্লিক করলে ” বোতাম -

HTML DOM শৈলী বর্ডার রাইট কালার প্রপার্টি

উপরের উদাহরণে -

আমরা "IMG1" আইডি দিয়ে একটি ইমেজ এলিমেন্ট তৈরি করেছি যেটিতে একটি সিএসএস স্টাইল প্রয়োগ করা হয়েছে। 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()">Change Border Color</button>

changeBorderRight() পদ্ধতি getElementById() পদ্ধতি ব্যবহার করে id “IMG1” সহ উপাদান পায় এবং এর বর্ডারRjghtColor শৈলী বৈশিষ্ট্য হালকা সবুজে সেট করে। এটি ডান সীমানার রঙকে হালকা সবুজে পরিবর্তন করে এবং এর অভ্যন্তরীণ HTML বৈশিষ্ট্য ব্যবহার করে "নমুনা" আইডি সহ অনুচ্ছেদে এই পরিবর্তনটি প্রদর্শন করে -

function changeBorderRight(){
   document.getElementById("IMG1").style.borderLeftColor="lightgreen";
   document.getElementById("Sample").innerHTML="The border left color is now changed to green";
}

  1. এইচটিএমএল ডম স্টাইল বর্ডার স্টাইল প্রপার্টি

  2. এইচটিএমএল ডম স্টাইল বর্ডার রাইটস্টাইল প্রপার্টি

  3. HTML DOM শৈলী বর্ডার রাইট কালার প্রপার্টি

  4. এইচটিএমএল ডম স্টাইল রঙের বৈশিষ্ট্য