ایجاد جدول در HTML – درس دهم

ایجاد جدول در HTML – درس دهم

ساده ترین حالت ایجاد جدول در HTML استفاده از ۳ تگ زیر می باشد:

  1. برای ایجاد جدول در html ، از تگ باز و بسته <table> (به معنی جدول) استفاده می شود.
  2. درون تگ <table> برای ایجاد سطر از تگ <tr> (مخفف Table Row به معنی سطر جدول) استفاده می شود.
  3. درون تگ <tr> برای ایجاد ستون از تگ <td> (مخفف Table Data به معنی محتوای جدول) برای قرار دادن محتوای جدول استفاده می شود.
  • تعداد ستون های جدول به تعداد تگ های <td> خواهد بود.
  • به عنوان مثال برای ایجاد سه ستون در یک سطر، درون تگ <tr> از سه تگ <td> استفاده نمایید.

مثال: نتیجه کدهای بالا:

ایجاد جدول در html

جدول بالا، صرفا با استفاده از کد های html ایجاد شده است و ظاهر کاملا ساده ای دارد.

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

صفت ها

  1. برای ایجاد کادر در جدول، درون تگ باز <table> از صفت “۱”=border استفاده نمایید.(اعداد بزرگتر از ۱ باعث بیشتر شدن ضخامت کادر می شوند.)
  2. در صورتی که می خواهید عرض یک سلول از جدول به اندازه دو یا چند ستون باشد، می توانید از صفت “تعداد”=colspan در تگ باز <td> استفاده نمایید.
  3. در صورتی که می خواهید ارتفاع یک سلول از جدول به اندازه دو یا چند سطر باشد، می توانید از صفت “تعداد”=rowspan در تگ باز <td> استفاده نمایید.
  • در ردیف های ۲ و ۳، به جای “تعداد” از عدد ۲ و یا بیشتر (به تعداد مورد نظر) استفاده نمایید.

مثال:

نتیجه کد های بالا:

جدول در html

  • تگ table صرفا برای ایجاد جدول کاربرد دارد و استفاده از آن برای شکل دهی به ظاهر صفحه html به دلیل تاثیرات منفی در سئو و زمان بارگزاری صفحه، کاملا اشتباه است.

 

خلاصه درس

  1. برای ایجاد جدول در html از تگ <table> استفاده می شود.
  2. برای ایجاد ردیف درون تگ <table> از تگ <tr> استفاده می شود.
  3. برای ورود محتوا در جدول، درون تگ <tr> از تگ <td> استفاده می شود. (ستون های جدول به تعداد تگ های <td> درون تگ <tr> خواهد بود.)
  4. برای ایجاد کادربندی برای جدول از صفت “border=”1 درون تگ باز <table> استفاده می شود.
  5. برای افزایش عرض یک سلول از جدول به اندازه عرض ۲ یا چند سلول، از صفت “تعداد”=colspan در تگ باز <td> استفاده می شود.
  6. برای افزایش ارتفاع یک سلول از جدول به اندازه ارتفاع ۲ یا چند سلول، از صفت “تعداد”=rowspan در تگ باز <td> استفاده می شود.
  7. تگ table صرفا برای ایجاد جدول در html کاربرد دارد نباید از آن برای شکل دهی به صفحه استفاده نمایید.

محتوای یک فایل html شامل جدول

تمرین

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

 

درس یازدهم (به زودی)

درس نهم

بازگشت به فهرست

 

 

ثبت امتیاز

1 رای​، میانگین: 5٫00 از 51 رای​، میانگین: 5٫00 از 51 رای​، میانگین: 5٫00 از 51 رای​، میانگین: 5٫00 از 51 رای​، میانگین: 5٫00 از 5 (1 رای​، میانگین: 5٫00 از 5)
برای ثبت امتیاز نیاز به عضویت دارید. برای ثبت نام می توانید از بالای همین صفحه اقدام کنید.
Loading...

ثبت نظر

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

رفتن به نوارابزار