HTML DOM স্টাইল টেবিল লেআউট প্রপার্টি এইচটিএমএল ডকুমেন্টে টেবিল সেল, সারি এবং কলাম যেভাবে রাখা হয় তা রিটার্ন করে এবং পরিবর্তন করে।
সিনট্যাক্স
নিম্নলিখিত সিনট্যাক্স −
1. রিটার্নিং টেবিল লেআউট
object.tableLayout
2. টেবিল লেআউট পরিবর্তন করা
object.tableLayout = “value”
এখানে মান −
হতে পারে| মান | ব্যাখ্যা |
|---|---|
| প্রাথমিক | এটি এই সম্পত্তির মানটিকে তার ডিফল্ট মান সেট করে। |
| উত্তরাধিকার | এটি তার মূল উপাদান থেকে এই সম্পত্তির মান উত্তরাধিকারসূত্রে পায়। |
| স্থির | এটি কলাম এবং টেবিলের প্রস্থের উপর ভিত্তি করে কলামের প্রস্থ নির্ধারণ করে। |
| অটো | এটি টেবিলের সবচেয়ে প্রশস্ত অবিচ্ছেদ্য বিষয়বস্তুর প্রস্থের উপর ভিত্তি করে কলামের প্রস্থ সেট করে। |
আসুন HTML DOM Style tableLayout Property -
-এর একটি উদাহরণ দেখিউদাহরণ
<!DOCTYPE html>
<html>
<style>
body {
color: #000;
background: lightblue;
height: 100vh;
text-align: center;
}
table {
margin: 2rem auto;
width: 400px;
}
.btn {
background: #db133a;
border: none;
height: 2rem;
border-radius: 2px;
width: 40%;
display: block;
color: #fff;
outline: none;
cursor: pointer;
margin: 1rem auto;
}
</style>
<body>
<h1>DOM Style tableLayout Property Demo</h1>
<table border="2">
<caption>Student Entry</caption>
<tr>
<th>Name</th>
<th>Roll No.</th>
</tr>
<tr>
<td>John</td>
<td>031717</td>
</tr>
<tr>
<td>Elon</td>
<td>041717</td>
</tr>
</table>
<button onclick="show()" class="btn">Set tableLayout</button>
<script>
function show() {
document.querySelector('table').style.tableLayout = "fixed";
}
</script>
</body>
</html> আউটপুট
“টেবিল লেআউট সেট করুন-এ ক্লিক করুন স্থির দিয়ে টেবিল লেআউট সেট করতে ” বোতাম মান −
