কম্পিউটার

HTML DOM শৈলী বর্ডার বাম রঙের বৈশিষ্ট্য


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

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

বর্ডারImageWidth বৈশিষ্ট্য −

সেট করা হচ্ছে
object.style.borderLeftColor = "color|transparent|initial|inherit"

উপরের বৈশিষ্ট্যগুলি নিম্নরূপ ব্যাখ্যা করা হয়েছে -

মান বিবরণ
রঙ বাম সীমানার রঙ নির্দিষ্ট করার জন্য। ডিফল্ট রঙ কালো সেট করা হয়
স্বচ্ছ বাম সীমানার রঙকে স্বচ্ছ করে তোলে এবং অন্তর্নিহিত বিষয়বস্তু দেখা যায়।
প্রাথমিক এই সম্পত্তি ডিফল্ট মান সেট করার জন্য।
উত্তরাধিকার অভিভাবক সম্পত্তি মান উত্তরাধিকারসূত্রে পেতে।

আসুন আমরা বর্ডারলেফ্ট কালার প্রপার্টি −

এর একটি উদাহরণ দেখি

উদাহরণ

<!DOCTYPE html>
<html>
<head>
<style>
   #IMG1{
      border-left:solid 8px;
      border-left-color: orange;
   }
</style>
<script>
   function changeBorderLeft(){
      document.getElementById("IMG1").style.borderLeftColor="lightgreen";
      document.getElementById("Sample").innerHTML="The border left color is now changed to green";
   }
</script>
</head>
<body>
<img id="IMG1" src="https://www.tutorialspoint.com/tensorflow/images/tensorflow-mini-logo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=550&w=150">
<p>Change the above image border left color by clicking the below button</p>
<button onclick="changeBorderLeft()">Change Border Color</button>
<p id="Sample"></p>
</body>
</html>

আউটপুট

HTML DOM শৈলী বর্ডার বাম রঙের বৈশিষ্ট্য

“চেঞ্জ বর্ডার কালার” ক্লিক করলে বোতাম -

HTML DOM শৈলী বর্ডার বাম রঙের বৈশিষ্ট্য

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

আমরা "DIV1" আইডি দিয়ে একটি ইমেজ এলিমেন্ট তৈরি করেছি যেটিতে একটি সিএসএস স্টাইল প্রয়োগ করা হয়েছে। CSS শৈলী বর্ডার বাম শৈলী এবং বর্ডার বাম রঙ নির্দিষ্ট করে।

#IMG1 {
   border-left:solid 8px;
   border-left-color: orange;
}
<img id="IMG1" src=" https://www.tutorialspoint.com/tensorflow/images/tensorflow-mini-logo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=550&w=150">

তারপরে আমরা “চেঞ্জ বর্ডার কালার” নামে একটি বোতাম তৈরি করেছি যা ব্যবহারকারীর দ্বারা ক্লিক করার পরে changeBorderLeft() পদ্ধতিটি কার্যকর করবে −

<button onclick="changeBorderLeft()">Change Border Color</button>

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

function changeBorderLeft(){
   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. এইচটিএমএল ডম স্টাইল রঙের বৈশিষ্ট্য