آموزش ایجاد table در html

بهاره حسنیبهاره حسنی
226 بازدید
table

تگ table تگی است که توسط آن میتوانیم در زبان html جدول طراحی کنیم.

داخل تگ table تگ های دیگری برای مشخص کردن سطر ها و ستون ها تعریف میکنیم.

تگ table یکی از تگ های پرکاربرد زبان html است.

با سلام خدمت کاربران عزیز وبسایت پرنیان طرح

در این آموزش قصد داریم تا تگ table در html آموزش دهیم.

معرفی تگ table :

تگ table تگی است که برای رسم جدول در صفحات وبسایت کاربرد دارد.

این تگ با تگ شروع <table> باز و با تگ پایانی </table> بسته میشود.

برای تعیین سطرها از تگ tr ، برای ستون ها از تگ td و برای سر ستون ها از تگ th درون تگ table استفاده میکنیم.

تگ tr ردیف های جدول است و ستونها و سرستون ها را داخل این تگ مینویسیم.

در مثال زیر با نحوه نوشتن تگ های یک جدول آشنا شوید :

[php]

<table>

<tr>

<th>نام</th>

<th>نام خانوادگی</th>

</tr>

<tr>

<td>علی</td>

<td>احمدی</td>

</tr>

</table>

[/php]

در تصویر زیر یک جدول با ستون ها و سرستون ها و ردیف هایش را مثال زده ایم:

table

table

کادر دادن به جدول :

برای کادر دادن به دور جدول و همچنین کادر دادن به خانه های آن از صفت border در استایل آن جدول استفاده مینماییم.

همانند مثال زیر یک border میدهیم و به آن مقدار هایی که میخواهیم میدهیم مثلا ضخامت دور جدول یک پیکسل باشد

طرح آن ساده باشد و رنگش سیاه باشد.

border

border

صفت cellspacing :

این صفت جهت ایجاد فاصله ی بین سلولی است و مقدارش عددی است با اعداد اندازه ای که میخواهیم سلول ها فاصله ها داشته باشند را مشخص میکنیم.

cellspacing

cellspacing

صفت colspan :

این صفت برای خانه هایی از جدول است که میخواهیم فضای بیشتری بهشان بدهیم ، به یک خانه به اندازه ی تعداد ستون های بیشتری فضا دهیم.

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

[php]

<table>

<tr>

<th>آدرس محل سکونت</th>

<th colspan=”3″>شماره تلفن ثابت</th>

</tr>

</table>

[/php]

tables

tables

صفت rowspan :

با صفت rowspan برای ردیف هایی از جدول فضای بیشتری میتوان اختصاص داد.

در تگ td تعداد خانه هایی که میخواهیم فضا بگیرد را در صفت roespan مقدار دهی میکنیم.

مثال:

[php]

<table>

<tr>

<td rowspan=”2″>نام کاربری</td>

<td>رمز عبور</td>

</tr>

</table>

[/php]

معرفی تگ caption :

این تگ برای نوشتن عنوان در بالای جدول است این تگ بعد از تگ شروع table نوشته میشود و برای هر جدول میتوان یک تگ caption برای معرفی عنوان آن جدول استفاده نمود.

مثال زیر را ببینید :

[php]

<table>

<caption>عنوان جدول</caption>

<tr>

<td>نام کاربری</td>

<td>رمز عبور</td>

</tr>

</table>

[/php]

منبع : www.w3schools.com

دسته بندی آموزش html
اشتراک گذاری

نوشته های مرتبط

دیدگاهتان را بنویسید

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

23+ محصولات
405+ سفارشات تکمیل شده
2098+ کاربران
399+ مطالب وبلاگ
سبد خرید

هیچ محصولی در سبد خرید نیست.

ورود به سایت