HTMLالوسم <table>
- تعريفه
- دعم المتصفحات
- خصائصه
- إستخدامه
- تصميمه الإفتراضي
تعريفه
نستخدم الوسم <table> لعرض جدول في الصفحة.
ملاحظة: الجدول لا يظهر أي خطوط حول الأسطر و الأعمدة الموضوعة فيه إلا إن قمت بتعديل تصميمه بواسطة CSS.
وسوم أساسية نضيفها في الجدول
بداخل الوسم <table> نستخدم الوسوم التالية بهدف تحديد طريقة بنائه:
- <tr> لإضافة سطر فيه.
- <th> لإضافة حقل عبارة عن عنوان في السطر.
- <td> لإضافة حقل عادي في السطر.
وسوم إختيارية نضيفها في الجدول
بداخل الوسم <table> يمكن إضافة الوسوم التالية بهدف تحسين طريقة ظهوره:
- <caption> لإضافة وصف للجدول.
- <colgroup> لتقسيم أعمدة الجدول لمجموعات بهدف تعديل تصميمها.
- <thead> لتجميع الأسطر التي تحتوي العناوين بهدف تعديل تصميمها.
- <tbody> لتجميع الأسطر التي تحتوي المعلومات العادية بهدف تعديل تصميمها.
- <tfoot> لتجميع الأسطر التي نضعها في آخر الجدول بهدف تعديل تصميمها.
دعم المتصفحات
الجدول التالي يظهر المتصفحات التي تدعم الوسم <table>.
Chrome | Edge | Firefox | Opera | Safari | Android Webview |
Chrome for Android |
Firefox for Android |
Opera for Android |
Safari for IOS |
Samsung Internet |
1 | 12 | 1 | مدعوم | مدعوم | 1 | 18 | 4 | مدعوم | مدعوم | 1.0 |
خصائصه
لا يملك أي خصائص تم إعدادها خصيصاً له.
إستخدامه
في المثال التالي قمنا بإنشاء جدول يتألف من 4 أسطر و كل سطر فيه 3 خانات.
المثال الأول
في المثال التالي قمنا بإضافة عنوان للجدول.
المثال الثاني
تصميمه الإفتراضي
بشكل عام جميع المتصفحات تعرضه بالتنسيق التالي.