آموزش طراحي سايت - آموزش ساخت جدول در html

آموزش Table در HTML

جدول هاي HTML به نويسندگان وب اجازه مي دهند تا داده هايي مانند متن، تصاوير، لينك ها، جدول هاي ديگر و غيره در رديف ها و ستون ها تنظيم كنيد. جدول هاي HTML با استفاده از برچسب < table> ايجاد مي شوند كه در آن برچسب < tr> براي ايجاد رديف ها و برچسب < td> براي ايجاد داده هاي سلول ها استفاده مي شوند.

 مثال:

ويژگي هاي colspan و rowspan

اگر بخواهيد دو يا بيشتر از دو ستون را با هم تلفيق كنيد از ويژگي colspan استفاده مي كنيد. به طور مشابه اگر بخواهيد دو يا بيشتر از دو رديف را در يك رديف تلفيق كنيد از rowspan استفاده كنيد.

 مثال:

 

پس زمينه ي جدول

مي توانيد به دو روش زير براي جدول خود زمينه اي تنظيم كنيد.

• ويژگي Bg color: مي توانيد رنگ زمينه را براي همه ي جدول و يا تنها براي يك سلول تنظيم كنيد.
• ويژگي background: مي توانيد يك تصوير را براي كل جدول يا تنها يك سلول تنظيم كنيد.

همچنين مي توانيد با استفاده از ويژگي bordercolor رنگ حاشيه را نيز تنظيم كنيد.

 مثال:

در اينجا مثالي در رابطه با استفاده از ويژگي background مي بينيد. در اين مثال ما از تصويري موجود در image directory استفاده كرده ايم.

آموزش html css

طول و عرض جدول

شما مي توانيد طول و عرض جدولي را با استفاده از ويژگي هاي width و height تنظيم كنيد. شما مي توانيد طول و عرض جدول را به پيكسل و يا متناسب با درصد صفحه ي جاري تنظيم كنيد.

 مثال:

شرح جدول

برچسب caption يك توضيح يا يك تيتر براي جدول مي باشد كه در بالاي جدول نمايش داده مي شود. اين برچسب در ورژن هاي جديد HTML/XHTML توصيه مي شود.

 مثال:

   
   

تيتر، بدنه و پاورقي جدول

جدول ها مي توانند به سه بخش تقسيم شوند: تيتر، بدنه و پاورقي جدول. عنوان و فوت(tfoot) در واقع شبيه به تيتر و پاورقي در يك فايل پردازش word مي باشند كه براي هرصفحه يكي مي باشد، در حاليكه بدنه همان نگه دارنده ي محتواي اصلي جدول مي باشد.
سه عنصر براي مجزا كردن عنوان، بدنه و فوت در يك جدول عبارتند از

• < thead> - براي ايجاد يك تيتر مجزا
• < tbody>- براي نشان دادن بدنه ي اصلي جدول
• < tfoot> - براي ايجاد يك پاورقي مجزا در يك جدول

يك جدول براي نشان دادن صفحات و گروه هاي مختلف يك داده، ممكن است داراي عناصر مختلفي باشد، اما ظاهر شدن برچسب هاي و قبل از زياد مهم نيست.

 مثال:

 

جدول هاي تودرتو

آموزش طراحي سايت با html

شما مي توانيد از يك جدول در داخل جدولي ديگر استفاده كنيد. نه تنها جدول ها، بلكه مي توانيد تمام برچسب ها را در داخل برچسب داده ي استفاده كنيد.

 مثال:

در زير مثالي را از استفاده ي يك جدول و برچسب هاي ديگر در داخل يك سلول مشاهده مي كنيد.

براي مشاهده اين مثال برروي آموزش طراحي سايت كليك نماييد.