HTML DOM ক্যাপশনসাইড প্রপার্টিটি টেবিলের ক্যাপশনের অবস্থান পেতে বা সেট করার জন্য ব্যবহার করা হয়। টেবিলের ক্যাপশনটি শুধুমাত্র উল্লম্ব অবস্থানে সেট করা হয় যেমন উপরে এবং নীচে।
−
-এর সিনট্যাক্স নিচে দেওয়া হলক্যাপশনসাইড প্রপার্টি −
সেট করা হচ্ছেobject.style.captionSide = "top|bottom|initial|inherit"
উপরের বৈশিষ্ট্যগুলি নিম্নরূপ ব্যাখ্যা করা হয়েছে:
| মান | বিবরণ |
|---|---|
| শীর্ষ | সারণীর উপরে টেবিলের ক্যাপশনের অবস্থান নির্ধারণের জন্য। এটি ডিফল্ট মান। |
| নীচে | সারণীর নীচে টেবিলের ক্যাপশনের অবস্থান নির্ধারণের জন্য। |
| প্রাথমিক | প্রাথমিক মান এই সম্পত্তি সেট করার জন্য। |
| উত্তরাধিকার | অভিভাবক সম্পত্তি মান উত্তরাধিকারসূত্রে পেতে |
আসুন ক্যাপশনসাইড প্রপার্টি −
এর জন্য একটি উদাহরণ দেখিউদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
#t1{
caption-side: bottom;
border: 2px dashed black;
}
td {
border: 2px solid blue;
}
caption {
font-size: 24px;
font-weight: bold;
}
</style>
<script>
function changeCaptionPosition(){
document.getElementById("t1").style.captionSide="top";
document.getElementById("Sample").innerHTML="The caption side is now changed to top ";
}
</script>
</head>
<body>
<table id="t1">
<caption>Demo Caption</caption>
<tr>
<th>demo head</th>
<th>demo head</th>
</tr>
<tr>
<td>there goes my data..</td>
<td>there goes my..</td>
</tr>
<tr>
<td>there goes my data..</td>
<td>there goes my..</td>
</tr>
</table>
<p>Change the above table caption position by clicking the below button</p>
<button onclick="changeCaptionPosition()">Change Caption Position</button>
<p id="Sample"></p>
</body>
</html> আউটপুট
“চেঞ্জ ক্যাপশন পজিশন এ ক্লিক করলে ” বোতাম
