در حال تکمیل آموزش زبان HTML

[مینا]

ساخت جدول در HTML

تگ جدول < table > :
اين تگ برای ايجاد جدول ها در صفحه استفاده می شود . به طور کلی جدول ها به 2 منظور ايجاد می شوند :

1- ايجاد يک جدول معمولی با تعدادی خانه ، برای نمايش مطالب مورد نظر در سطرها و ستون های جدا از هم .
2- تقسيم فضای صفحه با استفاده از چهارچوب جدول ها برای منظم چيدن محتويات صفحه. به طور مثال مطالب اين صفحه در تعدادی خانه جدول مرتب شده است. در اين حالت می توان با عدم تعيين حاشيه ( border ) برای خانه های جدول، از چهارچوب جدول ها استفاده کرد در حالی که آنها عملا از ديد کاربر مخفی هستند.
جدولها برای هر منظوری که بکار روند بايد با استفاده از تگ < table > ايجاد شوند. هر جدول مجموعه ای از سطرها و ستون هاست. برای ايجاد يک سطر جديد از يک تگ < tr > استفاده می شود که هر خانه ( ستون ) درون سطر هم توسط يک تگ < td > مشخص می شود.

الگوريتم طراحی جدول :

در طراحی جدول بايد به نکات زير دقت کرد :

1- در هنگام ايجاد يک سطر یا استفاده از تگ < tr > ، قبل از ايجاد سطر جديد حتما بايد تگ  < tr > قبلی بسته شود و در هر سطر نيز بايد در صورت ايجاد هر خانه با تگ  < td > قبل از ايجاد يک خانه جديد بايد تگ < td > قبلی بسته شود .
2- درون تگ < table > فقط می توان تگ < tr > و درون تگ < tr > نيز فقط می توان از تگ < td > استفاده کرد .
3- خانه ها و سطرهای يک جدول منظم و مرتب هستند. به عبارت ديگر به طور مثال نمی توان  در يک سطر جدول 3 خانه و در سطر پايينی آن 2 خانه با پهناهای متفاوت ايجاد کرد. در چنين مواردی بايد با استفاده از خاصيت colspan در تگ < td > سطر با خانه کمتر و استفاده از تکنيک جدول های تو در تو اين مسئله را بر طرف کرد.

جدول های تو در تو : می توان در درون يک جدول، جدول های ديگری نيز ايجاد کرد. در اين حالت جدول درونی همانند يک خانه جدول بيرونی خواهد بود. جدول درونی را بايد در يک تگ < td > جدول بيرونی ايجاد کرد. در اين حالت چيدمان خانه های جدول درونی به چيدمان خانه های جدول بيرونی ارتباطی ندارند.

مثال : تمام موارد ذکر شده را در مثال زير بررسی می کنيم :

*محتوای این قسمت تنها برای اعضای انجمن قابل مشاهده می باشد. *

تگ < tr > :
از اين تگ برای ايجاد يک سطر در جدول استفاده می شود. در درون هر سطر به تعداد دلخواه می توان ستون ( خانه جدول ) به وسيله تگ < td >  ايجاد کرد.
نکته : از تگ < tr > فقط برای ايجاد يک سطر جدول استفاده می شود نه ستون . تگ < tr >  بدون تگ < td > در درون آن خروجی ندارد.

مثال : ايجاد يک جدول با دو سطر :