এইচটিএমএল

🌈এইচটিএমএল কি?

📋এইচটিএমএল হলো টেবিলের সারি ও কলাম তৈরি করার পদ্ধতি।

⚒️এইচটিএমএল টেবিলের সারি ও কলাম তৈরি করতে ব্যবহৃত হয়।

এইচটিএমএল সমূহ

এইচটিএমএল এবং সেগুলোর ব্যবহারের তালিকা

➡️ table - টেবিল উপস্থাপনা তৈরি করা
➡️ tr - টেবিলের সারি তৈরি করা
➡️ th - টেবিলে হেডার তৈরি করা
➡️ td - টেবিলের বর্ণনা তৈরি করা
➡️ caption - টেবিলের শিরোনাম নির্ধারণ করা
➡️ colgroup - টেবিল কলাম দলবদ্ধ করা
➡️ col - টেবিল কলাম নির্ধারণ করা
➡️ thead - টেবিলের হেড তৈরি করা
➡️ tbody - টেবিলের বডি তৈরি করা
➡️ tfoot - টেবিলের পদপৃষ্ঠ তৈরি করা

table - টেবিল উপস্থাপনা তৈরি করার উদাহরণ।

html

<table border="1">
  <tr>
    <th>আইডি</th>
    <th>নাম</th>
    <th>দেশ</th>
  </tr>
  <tr>
    <td>10</td>
    <td>তানিম</td>
    <td>বাংলাদেশ</td>
  </tr>
  <tr>
    <td>11</td>
    <td>জোহান</td>
    <td>নেদারল্যান্ড</td>
  </tr>
  <tr>
    <td>12</td>
    <td>হামিদ</td>
    <td>আফগানিস্তান</td>
  </tr>
  <tr>
    <td>13</td>
    <td>সাকিব</td>
    <td>বাংলাদেশ</td>
  </tr>
</table>

tr - টেবিলের সারি তৈরি করার উদাহরণ।

html

<table border="1">
  <tr>
    <th>আইডি</th>
    <th>নাম</th>
    <th>দেশ</th>
  </tr>
  <tr>
    <td>10</td>
    <td>তানিম</td>
    <td>বাংলাদেশ</td>
  </tr>
  <tr>
    <td>11</td>
    <td>জোহান</td>
    <td>নেদারল্যান্ড</td>
  </tr>
  <tr>
    <td>12</td>
    <td>হামিদ</td>
    <td>আফগানিস্তান</td>
  </tr>
  <tr>
    <td>13</td>
    <td>সাকিব</td>
    <td>বাংলাদেশ</td>
  </tr>
</table>

th - টেবিলে হেডার তৈরি করার উদাহরণ।

html

<table border="1">
  <tr>
    <th>আইডি</th>
    <th>নাম</th>
    <th>দেশ</th>
  </tr>
  <tr>
    <td>10</td>
    <td>তানিম</td>
    <td>বাংলাদেশ</td>
  </tr>
  <tr>
    <td>11</td>
    <td>জোহান</td>
    <td>নেদারল্যান্ড</td>
  </tr>
  <tr>
    <td>12</td>
    <td>হামিদ</td>
    <td>আফগানিস্তান</td>
  </tr>
  <tr>
    <td>13</td>
    <td>সাকিব</td>
    <td>বাংলাদেশ</td>
  </tr>
</table>

td - টেবিলের বর্ণনা তৈরি করার উদাহরণ।

html

<table border="1">
  <thead>
    <tr>
      <th>নাম</th>
      <th>মূল্য</th>
    </tr>
  <thead>
  <tbody>
    <tr>
      <td>আপেল</td>
      <td>10</td>
    </tr>
    <tr>
      <td>আঙ্গুর</td>
      <td>15</td>
    </tr>
    <tr>
      <td>কমলা</td>
      <td>10</td>
    </tr>
    <tr>
      <td>কলা</td>
      <td>25</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>মোট</td>
      <td>60</td>
    </tr>
  </tfoot>
</table>

caption - টেবিলের শিরোনাম নির্ধারণ করার উদাহরণ।

html

<table border='1'>
  <caption>ব্যবহারকারীর তথ্য</caption>
  <tr>
    <th>আইডি</th>
    <th>নাম</th>
    <th>দেশ</th>
  </tr>
  <tr>
    <td>10</td>
    <td>তানিম</td>
    <td>বাংলাদেশ</td>
  </tr>
  <tr>
    <td>11</td>
    <td>জোহান</td>
    <td>নেদারল্যান্ড</td>
  </tr>
  <tr>
    <td>12</td>
    <td>হামিদ</td>
    <td>আফগানিস্তান</td>
  </tr>
  <tr>
    <td>13</td>
    <td>সাকিব</td>
    <td>বাংলাদেশ</td>
  </tr>
</table>

colgroup - টেবিল কলাম দলবদ্ধ করার উদাহরণ।

html

<table>
  <colgroup>
    <col span="2" style="background-color:blue">
    <col span="1" style="background-color:pink">
  </colgroup>
  <tr>
    <th>আইডি</th>
    <th>নাম</th>
    <th>দেশ</th>
  </tr>
  <tr>
    <td>10</td>
    <td>তানিম</td>
    <td>বাংলাদেশ</td>
  </tr>
  <tr>
    <td>11</td>
    <td>জোহান</td>
    <td>নেদারল্যান্ড</td>
  </tr>
  <tr>
    <td>12</td>
    <td>হামিদ</td>
    <td>আফগানিস্তান</td>
  </tr>
  <tr>
    <td>13</td>
    <td>সাকিব</td>
    <td>বাংলাদেশ</td>
  </tr>
</table>

col - টেবিল কলাম নির্ধারণ করার উদাহরণ।

html

<table>
  <colgroup>
    <col>
    <col span="1" style="background-color:pink">
  </colgroup>
  <tr>
    <th>আইডি</th>
    <th>নাম</th>
    <th>দেশ</th>
  </tr>
  <tr>
    <td>10</td>
    <td>তানিম</td>
    <td>বাংলাদেশ</td>
  </tr>
  <tr>
    <td>11</td>
    <td>জোহান</td>
    <td>নেদারল্যান্ড</td>
  </tr>
  <tr>
    <td>12</td>
    <td>হামিদ</td>
    <td>আফগানিস্তান</td>
  </tr>
  <tr>
    <td>13</td>
    <td>সাকিব</td>
    <td>বাংলাদেশ</td>
  </tr>
</table>

thead - টেবিলের হেড তৈরি করার উদাহরণ।

html

<table border="1">
  <thead>
    <tr>
      <th>নাম</th>
      <th>মূল্য</th>
    </tr>
  <thead>
  <tbody>
    <tr>
      <td>আপেল</td>
      <td>10</td>
    </tr>
    <tr>
      <td>আঙ্গুর</td>
      <td>15</td>
    </tr>
    <tr>
      <td>কমলা</td>
      <td>10</td>
    </tr>
    <tr>
      <td>কলা</td>
      <td>25</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>মোট</td>
      <td>60</td>
    </tr>
  </tfoot>
</table>

tbody - টেবিলের বডি তৈরি করার উদাহরণ।

html

<table border="1">
  <thead>
    <tr>
      <th>আইডি</th>
      <th>নাম</th>
      <th>দেশ</th>
    </tr>
  <thead>
  <tbody>
    <tr>
      <td>10</td>
      <td>তানিম</td>
      <td>বাংলাদেশ</td>
    </tr>
    <tr>
      <td>11</td>
      <td>জোহান</td>
      <td>নেদারল্যান্ড</td>
    </tr>
    <tr>
      <td>12</td>
      <td>হামিদ</td>
      <td>আফগানিস্তান</td>
    </tr>
    <tr>
      <td>13</td>
      <td>সাকিব</td>
      <td>বাংলাদেশ</td>
    </tr>
  </tbody>
</table>

tfoot - টেবিলের পদপৃষ্ঠ তৈরি করার উদাহরণ।

html

<table border="1">
  <thead>
    <tr>
      <th>নাম</th>
      <th>মূল্য</th>
    </tr>
  <thead>
  <tbody>
    <tr>
      <td>আপেল</td>
      <td>10</td>
    </tr>
    <tr>
      <td>আঙ্গুর</td>
      <td>15</td>
    </tr>
    <tr>
      <td>কমলা</td>
      <td>10</td>
    </tr>
    <tr>
      <td>কলা</td>
      <td>25</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>মোট</td>
      <td>60</td>
    </tr>
  </tfoot>
</table>

এইচটিএমএল সম্পর্কিত বিস্তারিত তথ্য

কার্যকর কোডিং উদাহরণ এবং সেগুলোর রেফারেন্স লিংক

নাম	বিবরণ
table	টেবিল উপস্থাপনা তৈরি করতে ব্যবহৃত হয়।
tr	টেবিলের সারি তৈরি করতে ব্যবহৃত হয়।
th	টেবিলে হেডার তৈরি করতে ব্যবহৃত হয়।
td	টেবিলের বর্ণনা তৈরি করতে ব্যবহৃত হয়।
caption	টেবিলের শিরোনাম নির্ধারণ করতে ব্যবহৃত হয়।
colgroup	টেবিল কলাম দলবদ্ধ করতে ব্যবহৃত হয়।
col	টেবিল কলাম নির্ধারণ করতে ব্যবহৃত হয়।
thead	টেবিলের হেড তৈরি করতে ব্যবহৃত হয়।
tbody	টেবিলের বডি তৈরি করতে ব্যবহৃত হয়।
tfoot	টেবিলের পদপৃষ্ঠ তৈরি করতে ব্যবহৃত হয়।