HTML DOM বর্ডারলেফ্ট প্রপার্টি একটি এলিমেন্টের জন্য বাম সীমানা বৈশিষ্ট্যগুলি পেতে বা সেট করার জন্য একটি সংক্ষিপ্ত হস্ত হিসাবে ব্যবহৃত হয়। বর্ডার-লেফ্ট সম্পত্তিতে সীমানা-বাম-প্রস্থ, সীমানা-বাম-শৈলী, সীমানা-বাম-রং রয়েছে৷
−
-এর সিনট্যাক্স নিচে দেওয়া হলবর্ডারImageWidth বৈশিষ্ট্য −
সেট করা হচ্ছেobject.style.borderLeft = "width style color|initial|inherit"
উপরের বৈশিষ্ট্যগুলি নিম্নরূপ ব্যাখ্যা করা হয়েছে -
| প্যারামিটার | বিবরণ |
|---|---|
| প্রস্থ | বাম সীমানা প্রস্থ সেট করার জন্য৷ |
| স্টাইল | বাম সীমানা শৈলী সেট করার জন্য৷ |
| রঙ | বাম সীমানার রঙ সেট করার জন্য৷ |
| প্রাথমিক | এই প্রপার্টি ডিফল্ট মান সেট করার জন্য। |
| প্রাথমিক | এই প্রপার্টি ডিফল্ট মান সেট করার জন্য। |
| উত্তরাধিকার | অভিভাবক সম্পত্তি মান উত্তরাধিকারী হতে। |
আসুন আমরা বর্ডারলেফ্ট প্রপার্টি −
এর একটি উদাহরণ দেখিউদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
#P1 {
border-left: 4px solid magenta;
font-size: 1.5rem;
}
</style>
<script>
function changeBorderLeft(){
document.getElementById("P1").style.borderLeft="9px dashed red";
document.getElementById("Sample").innerHTML="The left border for the paragraph element is now changed";
}
</script>
</head>
<body>
<p id="P1">This is some sample text inside the paragraph. Here is another line of this sample text</p>
<p>Change the above paragraph left border properties by clicking the below button</p>
<button onclick="changeBorderLeft()">Change Border Left</button>
<p id="Sample"></p>
</body>
</html> আউটপুট
"চেঞ্জ বর্ডার লেফট" ক্লিক করলে বোতাম -
উপরের উদাহরণে -
আমরা প্রথমে "P1" আইডি সহ একটি অনুচ্ছেদ তৈরি করেছি যাতে এটির ভিতরে কিছু পাঠ্য রয়েছে এবং এটিতে একটি অনুরূপ CSS শৈলী প্রয়োগ করা হয়েছে৷
#P1 {
border-left: 4px solid magenta;
font-size: 1.5rem;
}
<p id="P1">This is some sample text inside the paragraph. Here is another line of this sample text</p> তারপরে আমরা একটি বোতাম তৈরি করেছি "বাম সীমানা পরিবর্তন করুন" যা ব্যবহারকারীর দ্বারা ক্লিক করার পরে changeBorderLeft() ফাংশনটি কার্যকর করবে।
<button onclick="changeBorderLeft()">Change Border Left</button>
changeBorderLeft() ফাংশন getElementById() পদ্ধতি ব্যবহার করে id “P1” সহ অনুচ্ছেদ উপাদানটির বর্ডারলেফ্ট স্টাইল বৈশিষ্ট্য পায় এবং এর সম্পত্তির মান পরিবর্তন করে ‘9px ড্যাশড লাল’। এই পরিবর্তনের ইঙ্গিত দেয় এমন একটি বার্তা তারপর তার অভ্যন্তরীণ এইচটিএমএল বৈশিষ্ট্য ব্যবহার করে "নমুনা" আইডি সহ অনুচ্ছেদে প্রদর্শিত হয়৷
function changeBorderLeft(){
document.getElementById("P1").style.borderLeft="9px dashed red";
document.getElementById("Sample").innerHTML="The left border for the paragraph element is now changed";
} 