در راستای برنامه نویسی HTML یکی از تگ های مهم در خصوص ایجاد جدول می باشد. از این تگ در ایجاد سطر و ستون با تعداد مختلف کاربرد فراوانی دارد. تگ جدول با <table> ایجاد می نمایند.

تگ جدول HTML <table> Tag

تگ جدول html دارای عنصر هایی هستن که موجب نمایش آنان می شود.

  • <tr> این عنصر سطر را ایجاد می نماید.
  • <td> این عنصر ستون را ایجاد می نماید که درون هر سطر می توانید تعداد دلخواهی از ستون ایجاد نمایید.
  • <caption>
  • <colgroup>
  • <thead>
  • <tfoot>
  • <tbody>

نمونه کد تگ جدول table

<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>

پشتیبانی مرورگر از تگ تیبل

Elementمرورگر کروممرورگر edgeمرورگر فایرفاکسمرورگر سافاریمرورگر اپرا
<table>YesYesYesYesYes

شما قادرید برای جدول خود از استایل استفاده نمایید. اینگونه جدول شما دارای رنگ بندی و بسیاری از موارد دیگر می شود.

در صورتیکه شما از CMS ها برای ساخت سایت استفاده ننمایید. به ناچار نیاز به یادگیری پیاده سازی تمامی تگ های HTML از جمله جدول هستید. ولی امروزه برای برخورداری از طراحی سایت قیمت مناسب و همچنین سرعت ایجاد یک سایت از CMS ها استفاده میشود.

آنان دارای فضای کاربری گرافیکی هستند که نیاز به کدزنی نمی باشد. فقط با کلیک بروی عنصر در جدول آنان قادر به ایجاد جدول هستید. ولی برای بسیاری از Front کارها همچنان تسلط بر این تگ ها اجباری است.

وبسایت هایی که از پایه کدزنی می گردند. مطمئنن از جدول استفاده می نمایند. در گذشته برای پارتیشن بندی یک صفحه وب از این تگ استفاده میشد. ولی امروزه برای نمایش وبسایت در مرورگر و صفحه نمایش های مختلف نیاز است که برای پارتیشن بندی صفحه از المنت هایی همچون div استفاده گردد که با استفاده از استایل اقدام به چیدمان می نمایند.

برای اجرای ساده این کد ، قادرید یک فایل به نام index.html داخل دسکتاپ کامپیوتر خود ایجاد کنید. کد نمونه بالا را درون آن قرار دهید. سپس فایل را باز نمایید. مطمئنن خروجی به درستی برای شما نمایش می گردد.