خانه / آموزش کامل HTML / آموزش کامل HTML – قسمت یازدهم: تغییرات در جدول
آموزش اچ تی ام ال

آموزش کامل HTML – قسمت یازدهم: تغییرات در جدول

در قسمت قبل با جدول ها در html آشنا شدیم. جدول هایی که در جلسه قبل تولید می کردیم از ظاهر زیبایی برخوردار نبودند. در این جلسه قصد داریم تغییراتی در ظاهر و زیبایی جدول هایمان داشته باشیم. در این قسمت از آموزش قصد داریم شما را با دو تغییر اساسی در جداول آشنا کنیم.

اضافه کردن قاب

برای قرار دادن قاب دور جدول ها تنها کافی است که از اتربیوت border در تک <table> استفاده کنیم. در مثال زیر ما یک قاب یک پیکسلی دور جدول کشیده ایم که این قاب بین تمام سلول ها نیز اعمال می شود.

نکته: می توانیم از طریق اضافه کردن استایل نیز قاب دور جدول را رسم کنیم.

<table style=”border:1px;”>

تیتر های جدول

یک جدول فقط شامل سطر و ستون ها نمی شود. هر ستون جدول باید دارای عنوان باشد. در مثال زیر جدولی طراحی می کنیم که شامل عناوین نام، نام خانوادگی و سن می باشد.

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

خاصیت colspan

گاهی اوقات پیش می آید که می خواهیم ستون های یک سطر جدول را یکی کنیم. این کار مشابه عمل مرج کردن در نرم افزار ورد آفیس است. برای این کار از اتربیوت colspan استفاده می کنیم. به مثال زیر توجه کنید:

عددی که در مقابل colspan قرار می گیرد نشان دهنده تعداد ستون هایی است که می خواهیم در سطر مورد نظر یکی شوند.

درباره ما admin

محمد صفری : مدیر پردیس وردپرس ، مهندس نرم افزار و طراح سایت

این موارد رو هم بررسی کنید

آموزش اچ تی ام ال

آموزش کامل HTML – قسمت ۱۲: تگ span

آخرین ویرایش در تاریخ ۱۴ تیر ۱۳۹۶ تگ <span> کاربرد زیادی در شخصی سازی متن …

پاسخ دهید