HTML TABLE Tag
<table></table>
<tr></tr> (tr তে table row)
<td></td> (td তে table data)
<th></th> (th তে table header)
এই ৪ টি ট্যাগ ব্যাবহার করা হয়
নীচের কোডটি বডি ট্যাগে লেখি
<table>
<tr>
<th>Markup</th>
<th>Programming</th>
<th>Database</th>
</tr>
<tr>
<td>HTML</td>
<td>JS</td>
<td>SQL</td>
</tr>
<tr>
<td>CSS</td>
<td>PHP</td>
<td>MySQL</td>
</tr>
</table>
কোডটি রান করলে ছবির মত দেখাবে ।
table ট্যাগের ভিতরে আমরা ৩ টি রো তৈরী করেছি ,
প্রথমটি হেড এর জন্য বাকি ২ টি রো আমরা সেই হেডিং এর উপাদান গুলো দিয়েছি ।
এখন প্রশ্ন আসতে পারে এখানে টেবিলের ভিতরের লেখা গুলো দেয়া হল কিন্তু টেবিলের কোন দাগ নেই কেন ?
প্রথম টেবিল ট্যাগের বদলে <table border="1"> ট্যাগটি ব্যাবহার করব । তাহলেই টেবিলের বর্ডার দেখা যাবে । table ছিল একটি ট্যাগ , এর সাথে বর্ডার নতুন এড করা হয়েছে সহজ ভাষায় বলতে গেলে ট্যাগের সাথে এক্সট্রা কিছু এড হলে সেটি হবে এট্রিবিউট ।
এক এর বদলে ২-৩-৪ ব্যাবহার করুন , দেখুন কিরকম দেখা যায় ।
এবার টেবিলের ২ টি সেল বা অংশ করে দিব অনেকটা এই ছবির মত
এর জন্য আমরা td, th এ rowspan এবং colspan এট্রিবিউট দুটি ব্যাবহার করব ।
উপরের ছবির মত টেবিল তৈরী করতে হলে এইরকম কোড করতে হবে
<table border="1">
<tr>
<th rowspan="2">Web Language</th>
<td>HTML</td>
<td>CSS</td>
</tr>
<tr>
<td>PHP</td>
<td>JS</td>
</tr>
<tr>
<th>Framework</th>
<td>CI</td>
<td>Bootstrap</td>
</tr>
</table>
রান করে দেখুন । আশা করি rowspan বুঝতে পেরেছেন , ১৩ এবং ১৪ নম্বর লাইনদুটি বাদদিয়ে <td colspan="2"></td> লাইনটি দিন। দেখুন কি হয় ,
<br> ট্যাগঃ
এবার আসি Line Break নিয়ে
p tag এর ভিতরে লেখার সময় <br/> ট্যাগ ব্যাবহার করলে পরের লাইন থেকে লেখা শুরু হয়, যদিও শুধু <br> ও একই কাজ করে ।
<hr/> ট্যাগঃ
আড়াআড়ি ভাবে লম্বা রেখা দেয়ার জন্য hr ট্যাগটি ব্যবহৃত হয়।
বডি ট্যাগের ভিতরে নীচের কোডটি রান করে দেখুন
<p>Bangladesh</p><br/><hr/>
<p>Bangladesh</p>
Comment:
প্রোগ্রামিং বা কোডিং এর গুরুত্বপূর্ন বিষয় হল কমেন্ট , যা শুধু কোডার এর বুঝার সুবিধার জন্য দেয়া হয় , এটি ডিস্প্লে তে দেখা যায় না
, এটি শুধু মাত্র সোর্স কোডেই দেখা যায়।
<!-- কমেন্ট --> , এই চিহ্ন দুটির মাঝখানে আপনি যা লেখবেন তাই কমেন্ট হিসেবে বসবে ।
