এইচটিএমএল-এ টেবিল: এইচটিএমএল-এ টেবিল তৈরি এবং ফর্ম্যাট করার জন্য একটি নির্দেশিকা

সারি এবং কলাম সহ একটি কাঠামোগত বিন্যাসে ডেটা প্রদর্শনের জন্য একটি টেবিল HTML-এর একটি অপরিহার্য উপাদান। HTML এ, <table>, <tr> এবং <td> ট্যাগ ব্যবহার করে টেবিল তৈরি করা হয়।

<table> ট্যাগটি প্রধান টেবিল ধারককে প্রতিনিধিত্ব করে, যেটিতে সমস্ত সারি এবং কলাম রয়েছে। সারিগুলিকে <tr>(টেবিল সারি) ট্যাগ ব্যবহার করে সংজ্ঞায়িত করা হয়, যখন সারির মধ্যে থাকা ঘরগুলিকে <td>(টেবিল ডেটা) ট্যাগ ব্যবহার করে সংজ্ঞায়িত করা হয়। অতিরিক্তভাবে, আপনি টেবিলের জন্য হেডার সেল সংজ্ঞায়িত করতে <th>(টেবিল হেডার) ট্যাগ ব্যবহার করতে পারেন।

আপনি টেবিলের ঘরগুলিকে একত্রিত করতে বা একাধিক সারি এবং কলাম জুড়ে স্প্যান সেলগুলিকে একত্রিত করতে colspan এবং rowspan এর মতো বৈশিষ্ট্যগুলি ব্যবহার করতে পারেন৷ উপরন্তু, আপনি টেবিলের চেহারা এবং বিন্যাস কাস্টমাইজ করতে CSS বৈশিষ্ট্য প্রয়োগ করতে পারেন।

 

টেবিল( <table>)

- <table> HTML এ একটি টেবিল তৈরি করতে উপাদানটি ব্যবহার করা হয়।

- ডেটা সারি( <tr>) এবং কলামে( <td> বা <th>) স্থাপন করা হয়।

- প্রতিটি ডেটা সেল <td>(ডেটা সেল) বা <th>(হেডার সেল) উপাদানগুলির মধ্যে স্থাপন করা হয়।

<table>  
  <tr>  
    <th>No.</th>  
    <th>Name</th>  
    <th>Age</th>  
  </tr>  
  <tr>  
    <td>1</td>  
    <td>John</td>  
    <td>25</td>  
  </tr>  
  <tr>  
    <td>2</td>  
    <td>Jane</td>  
    <td>30</td>  
  </tr>  
</table>  

 

কলাম হেডার( <th>)

- <th> উপাদানটি একটি টেবিলে কলাম হেডার তৈরি করতে ব্যবহৃত হয়।

- সাধারণত টেবিলের প্রথম সারিতে রাখা হয়।

<table>  
  <tr>  
    <th>No.</th>  
    <th>Name</th>  
    <th>Age</th>  
  </tr>  
  <!-- data rows -->  
</table>  

 

ডেটা সারি( <tr>):

- <tr> উপাদানটি একটি টেবিলে ডেটা সারি তৈরি করতে ব্যবহৃত হয়।

- ডেটা সেল( <td>) বা হেডার সেল() এই উপাদানগুলির <th> মধ্যে স্থাপন করা হয় । <tr>

<table>  
  <tr>  
    <th>No.</th>  
    <th>Name</th>  
    <th>Age</th>  
  </tr>  
  <tr>  
    <td>1</td>  
    <td>John</td>  
    <td>25</td>  
  </tr>  
  <tr>  
    <td>2</td>  
    <td>Jane</td>  
    <td>30</td>  
  </tr>  
</table>  

 

কলাম স্প্যানিং( colspan)

colspan একটি ডেটা সেল বা হেডার সেল টেবিলে কতগুলি কলাম থাকবে তা নির্ধারণ করতে অ্যাট্রিবিউটটি ব্যবহার করা হয় ।

<table>  
  <tr>  
    <th colspan="2">Personal Information</th>  
  </tr>  
  <tr>  
    <td colspan="2">John Doe</td>  
  </tr>  
</table>  

 

সারি স্প্যানিং( rowspan)

rowspan একটি ডেটা সেল বা হেডার সেল টেবিলে কতগুলি সারিতে থাকবে তা নির্ধারণ করতে অ্যাট্রিবিউটটি ব্যবহার করা হয় ।

<table>  
  <tr>  
    <th rowspan="2">No.</th>  
    <td>1</td>  
    <td>John</td>  
  </tr>  
  <tr>  
    <td>2</td>  
    <td>Jane</td>  
  </tr>  
</table>  

 

কোষ একত্রিত করা( colspan এবং rowspan)

আপনি একটি টেবিলে ঘর মার্জ করতে উভয় colspan এবং গুণাবলী একত্রিত করতে পারেন। rowspan

<table>  
  <tr>  
    <th rowspan="2">No.</th>  
    <th colspan="2">Personal Information</th>  
  </tr>  
  <tr>  
    <td>John</td>  
    <td>25</td>  
  </tr>  
</table>  

 

border সম্পত্তি

- border বৈশিষ্ট্যটি টেবিলের সীমানার বেধ উল্লেখ করে।

- এর মান border একটি অ-ঋণাত্মক পূর্ণসংখ্যা।

<table border="1">  
<!-- Table rows and columns -->  
</table>  

 

cellpadding সম্পত্তি

-, cellpadding প্রপার্টিটি টেবিলে ঘরের কন্টেন্ট এবং ঘরের সীমানার মধ্যে দূরত্ব নির্দিষ্ট করে।

- এর মান cellpadding একটি অ-ঋণাত্মক পূর্ণসংখ্যা

<table cellpadding="5">  
<!-- Table rows and columns -->  
</table>  

 

cellspacing সম্পত্তি

- cellspacing বৈশিষ্ট্যটি টেবিলের কক্ষগুলির মধ্যে ব্যবধান নির্দিষ্ট করে।

- এর মান cellspacing একটি অ-ঋণাত্মক পূর্ণসংখ্যা।

<table cellspacing="10">  
<!-- Table rows and columns -->  
</table>  

 

এই বৈশিষ্ট্যগুলি এবং উপাদানগুলি আপনাকে আপনার প্রয়োজন অনুসারে HTML-এ টেবিল তৈরি এবং কাস্টমাইজ করতে দেয়। আপনি আপনার ওয়েবসাইটে একটি পরিষ্কার এবং সংগঠিত পদ্ধতিতে ডেটা প্রদর্শন করতে তাদের ব্যবহার করতে পারেন।