آموزش تگ td در HTML

آموزش تگ td در HTML

تگ <td> در HTML برای ایجاد سلول‌های داده در جدول‌ها استفاده می‌شود. این تگ معمولاً در داخل ردیف‌های جدول قرار می‌گیرد و مقادیر داده را نمایش می‌دهد. در این مقاله، ما به بررسی کامل تگ <td> همراه با ویژگی‌ها و مثال‌های عملی آن می‌پردازیم.

1. تگ td در HTML

تگ <td> برای ایجاد سلول‌های داده در جدول‌ها استفاده می‌شود. این تگ معمولاً درون ردیف‌های جدول قرار می‌گیرد و اطلاعات و داده‌های مربوط به آن ردیف را نمایش می‌دهد.

<table>
   <tr>
      <td>مهندس</td>
      <td>30</td>
   </tr>
</table>

2. ویژگی‌ها و Attribute‌های تگ td

تگ <td> دارای ویژگی‌هایی است که برای تنظیم خصوصیات سلول داده استفاده می‌شوند.

2.1. align

این ویژگی برای تعیین چیدمان متن داخل سلول داده استفاده می‌شود و می‌تواند مقادیر left، center و right را داشته باشد.

<td align="center">30</td>

2.2. colspan

این ویژگی برای تعیین تعداد ستون‌هایی است که سلول داده از آنها باید بپوشاند استفاده می‌شود.

<td colspan="2">مهندس</td>

2.3. rowspan

این ویژگی برای تعیین تعداد ردیف‌هایی است که سلول داده از آنها باید بپوشاند استفاده می‌شود.

<td rowspan="2">30</td>

3. مثال‌های استفاده از تگ td

3.1. جدول با سلول‌های داده معمولی

<table>
   <tr>
      <td>مهندس</td>
      <td>30</td>
   </tr>
</table>

3.2. جدول با سلول داده با چیدمان متن متفاوت

<table>
   <tr>
      <td align="center">مهندس</td>
      <td align="right">30</td>
   </tr>
</table>

3.3. جدول با سلول داده‌های ترکیبی

<table>
   <tr>
      <td colspan="2">مهندس</td>
   </tr>
   <tr>
      <td>30</td>
      <td>بازاریاب</td>
   </tr>
</table>

نتیجه‌گیری

تگ <td> در HTML برای ایجاد سلول‌های داده در جدول‌ها استفاده می‌شود. این تگ به شما امکان می‌دهد تا اطلاعات و داده‌های مختلف را درون سلول‌های جدول نمایش دهید. با استفاده از ویژگی‌ها و ترکیب با تگ‌های دیگر مانند <tr>، می‌توانید جداول با ساختار و ظاهر مختلفی ایجاد کنید که برای نمایش دادن اطلاعات دسته‌بندی‌شده و متنوع بسیار مناسب خواهد بود.

پست های مرتبط

مطالعه این پست ها رو از دست ندین!
JavaScript - تاریخ‌ها (Dates)

JavaScript – تاریخ‌ها (Dates)

آبجکت‌های تاریخ (Date) در جاوااسکریپت آبجکت‌های تاریخ در جاوااسکریپت به ما امکان کار با تاریخ و زمان را می‌دهند....

بیشتر بخوانید
JavaScript - آرایه‌های ثابت (Array Const)

JavaScript – آرایه‌های ثابت (Array Const)

جاوااسکریپت: تعریف آرایه با const در سال 2015، جاوااسکریپت کلمه کلیدی مهمی به نام const را معرفی کرد. این...

بیشتر بخوانید
JavaScript - تکرار آرایه‌ها (Array Iteration)

JavaScript – تکرار آرایه‌ها (Array Iteration)

جاوا اسکریپت: تکرار بر روی آرایه‌ها جاوا اسکریپت روش‌های مختلفی برای تکرار (Iteration) بر روی آرایه‌ها ارائه می‌دهد که...

بیشتر بخوانید

نظرات

سوالات و نظراتتون رو با ما به اشتراک بذارید

برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید.