خانه آموزش برنامه نویسی آموزش اچ‌تی‌ام‌ال HTML Tables

آموزش اچ‌تی‌ام‌ال HTML Tables

1 زمان مورد نیاز برای خواندن
۰
0
87

در این بخش از آموزش HTML جدول (HTML Tables) توضیح داده می شود.

استفاده از جدول در اچ‌تی‌ام‌ال بسیار کاربردی می باشد و خیلی از وب سایت ها هستند که اساس کدنویسیشون جدول Tableb بوده مخصوصاً سایت های قدیمی که همه چیز رو داخل جدول طراحی می کردند.

نمونه استفاده از جدول (Tables) در اچ‌تی‌ام‌ال به این صورت می باشد :

<!DOCTYPE html>
<html dir="rtl">
<head>
<style>
table,th,td {
border: 1px solid black;
border-collapse: collapse;
}
th,td {
padding: 5px;
}
</style>
</head>
<body>
<h2>جدول در اچ تی ام ال</h2>

<table style="width:100%">
<tr>
<th>نام</th>
<th colspan="2">شماره ها</th>
</tr>
<tr>
<td>زمان</td>
<td>111 222 333</td>
<td>444 555 666</td>
</tr>
</table>
</body>
</html>

HTML جدول

توضیحات لازم:

پدینگ ( padding) یعنی فاصله از اطراف در واقع برای اینکه جدول زیاد توهم نباشه از padding استفاده کردیم.

مرز (border) برای این هست که معلوم بشه که مرز جدول ها کجا هستند و با رنگ black مشخص کردیم.

استفاده از colspan برای این هست که یک خانه (سلول) برابر چند خانه باشد؟!! که در بالا برابر با ۲ خانه قرار دادیم.

تگ <h2> برای نمایش عنوان (Heading) استفاده می شود.

از تگ جدول table برای شروع نوشتن و ساختن جدول استفاده می شود؛ و برای اینکه تمام عرض در مرورگر نمایش داده شود عرض آن را ۱۰۰ درصد (width:100%) تعریف کردیم.

تگ th در جداول، نشانگر سرتیتر ها می باشد.

تگ table به تنهایی معمولا کاربرد خاصی ندارد و سلول های ساخته شده با th و td هستند که به آن فرم می دهند، تگ td سلول های داخلی و در واقع محتوای داخل یک جدول را دربرمی گیرد.

نوشته ها در نوت پد ویندوز :

HTML جدول

خروجی:

HTML جدول

  • نوع داده ها در PHP

    نوع داده رشته ای (string) در PHP string یا رشته ، زنجیره ای از کاراکترهاست مثل: “Hi Ali” ی…
  • متغیرها در PHP و فرق دابل کوتیشن و تک کوتیشن

    نحوه تعریف متغیرها (Variables) در PHP  متغیرها مکانی برای ذخیره‌سازی اطلاعات است…
  • دستور echo و Print در PHP

    دستور Echo در زبان برنامه نویسی PHP دستور echo بسیار پرکاربرد و اهمیت دارد دستور echo به م…
مقالات مرتبط بیشتر را بارگیری کنید
بارگزاری مطالب دیگر Ansel
Load More In آموزش برنامه نویسی

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

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

پنج + 16 =

همچنین بررسی کنید

چگونه یک اپلیکیشن اندروید با Android Studio بسازیم ؟

در این آموزش اصول اولیه ساختن یک برنامه اندرویدی (اپلیکیشن اندروید) با استفاده از محیط توس…