دوره آموزشی HTML | جلسه دهم


1/5 - (1 امتیاز)

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

قانون کلی در جدول ها:

تعداد تگ <td></td> در سطر های مختلف یک جدول باهم برابر خواهد بود، ولی استثنا هایی هم وجود دارد که در این قسمت به آن میپردازیم.
اگر بخواهیم دو ستون را Merge کنیم کافیست در یکی تگ های <td></td> را پاک کنیم و در تگ باقی مانده از صفت colspan استفاده کنیم و مقدار آن را برابر با تعداد سطر های حذفی + 1 کنیم.

[su_note note_color=”#0ea400″]نکته: تگ <td></td> دارای صفت bgcolor نیز میباشد.[/su_note]

قانون کلی در جدول های HTML

قانون کلی در جدول های HTML

اما اگر بخواهیم در سطر Merge کنیم، به اندازه ای که میخواهی از پایین آخرین <td></td> را حذف میکنیم  و سپس در تگ <td></td> باقی مانده از صفت rowspan استفاده میکنیم و مقدار آن را برابر تعداد سطر های حذفی+1 میگذاریم.

Merge سطر جداول در HTML

Merge سطر جداول در HTML

[su_note note_color=”#0ea400″]نکته: تگ <table></table> صفتی هم مثل align دارد که مقدار آن برابر با center, right, left است.[/su_note]

صفت align در تگ <table> در HTML

تگ <table></table> دارای دو صفت cellpadding و cellspacing است که مقدار پیش فرض آن ها صفر نیست، صفت cellpadding فواصل داخلی هر یک از تگ های <td></td> با border ها است.

صفت cellpadding در جداول HTML

صفت cellpadding در جداول HTML

اما cellspacing فاصله بین هر <td></td با <td></td> های کناری جدول است ، پس برای از بین بردن فواصل در خانه های جدول مقدار cellspacing را برابر صفر قرار میدهیم.

صفت cellspacing در جداول HTML

صفت cellspacing در جداول HTML

[su_note note_color=”#0ea400″]نکته: میتوانیم از جداول تو در تو نیز استفاده کنیم به این صورت که داخل هر تگ <td></td> یک جدول ایجاد میکنیم که سطر (<tr></tr>) و ستون های (<td></td>) مستقل دارد[/su_note]

جداول تو در تو در HTML

جداول تو در تو در HTML

همینطور میتوانیم به جای تگ <td></td> از تگ <th></th> استفاده کنیم در این حالت محتویات هم Bold بشوند و هم وسط چین میشوند.

تگ <th> در جداول HTML

تگ <th> در جداول HTML

[su_note note_color=”#0ea400″]نکته: تقریبا تمام صفات در تگ <td></td> در تگ <tr></tr> هم وجود دارد.[/su_note]

پایان جلسه دهم از دوره آموزشی HTML.

بدون دیدگاه

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

نشانی ایمیل شما منتشر نخواهد شد.