HTML DOM ক্লায়েন্ট বাম বৈশিষ্ট্য পিক্সেলে একটি উপাদানের বাম সীমানার প্রস্থ প্রদান করে। এটি শুধুমাত্র পঠনযোগ্য সম্পত্তি। এই বৈশিষ্ট্যটি একটি উল্লম্ব স্ক্রলবারের প্রস্থ অন্তর্ভুক্ত করবে তবে এটি কখনই একটি উপাদানের বাম মার্জিন বা বাম প্যাডিং অন্তর্ভুক্ত করবে না৷
সিনট্যাক্স
ক্লায়েন্ট লেফট প্রপার্টি -
-এর জন্য সিনট্যাক্স নিচে দেওয়া হলelement.clientLeft
উদাহরণ
আসুন HTML DOM ক্লায়েন্ট লেফট প্রপার্টি -
-এর একটি উদাহরণ দেখি<!DOCTYPE html>
<html>
<head>
<style>
#styleDiv {
height: 200px;
width: 200px;
padding: 5px;
margin: 10px;
border-left: 10px solid blue;
background-color: lightgreen;
}
</style>
</head>
<body>
<p>Click the below button to get border left width in pixels</p>
<button onclick="leftWidth()">LEFT WIDTH</button>
<div id="styleDiv">
</div>
<p id="Sample"></p>
<script>
function leftWidth() {
var x= document.getElementById("styleDiv");
var txt = "Border left width: " + elmnt.clientLeft + "px";
document.getElementById("Sample").innerHTML = txt;
}
</script>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট −
তৈরি করবে
বাম প্রস্থ -
-এ ক্লিক করলে
উপরের উদাহরণে -
আমরা "styleDIV" আইডি সহ একটি ডিভি তৈরি করেছি এবং এটির আইডি ব্যবহার করে একটি স্টাইল প্রয়োগ করেছি৷
#styleDiv {
height: 200px;
width: 200px;
padding: 5px;
margin: 10px;
border-left: 10px solid blue;
background-color: lightgreen;
}
<div id="styleDiv">
</div> তারপরে আমরা একটি বাম প্রস্থ বাটন তৈরি করেছি যা ক্লিক −
-এ widthDiv() পদ্ধতি চালাবে।<button onclick="widthDiv()"<LEFT WIDTH</button>
leftWidth() getElementById() মেথড ব্যবহার করে
এলিমেন্ট পায় এবং এটি পরিবর্তনশীল x-এ বরাদ্দ করে। তারপর
-এ ক্লায়েন্ট লেফ্ট প্রপার্টি ব্যবহার করে আমরা এর বাম সীমানার প্রস্থ পাই এবং কিছু টেক্সট যুক্ত করার পর এটি পরিবর্তনশীল txt-এ বরাদ্দ করি। txt-এর ভিতরের টেক্সটটি অনুচ্ছেদের ভিতরের এইচটিএমএল প্রপার্টি ব্যবহার করে প্যারাগ্রাফের ভিতরে প্রদর্শিত হয় এবং এটিতে txt ভেরিয়েবল বরাদ্দ করা হয় −
function leftWidth() {
var x= document.getElementById("styleDiv");
var txt = "Border left width: " + elmnt.clientLeft + "px";
document.getElementById("Sample").innerHTML = txt;
} 