مفهوم الجدول الجدول ( Table) يسمح لك بعرض المعلومات بشكل مرتب و مقسم لأعمدة و أسطر. في هذا الدرس ستتعلم كيف تنشئ جدول, كيف تضيف فيه أسطر, كيف تضيف فيه أعمدة و كيف تدمج الأعمدة و الأسطر مع بعضها. إضافة جدول في الصفحة لعرض جدول في الصفحة نستخدم الوسوم التالية لبنائه بالشكل الذي نريده:
سنضيف الخاصية border="1" في جميع الأمثلة التي نضعها حتى تظهر خطوط الجدول. ملاحظة إبتداءاً من الإصدار الخامس في HTML لم نعد نستخدم هذه الخصائص ابتداءاً لأننا أصبحنا نعدّل تصاميم الجداول بواسطة CSS و هي توفر الكثير من الخصائص التي يمكننا استخدامها لأجل ذلك. في هذا الدرس سنستخدم هذه الخصائص فقط ليكون الشرح أكثر وضوحاً. في المثال التالي قمنا بإظهار خطوط الجدول حجمها 1 بيكسل. المثال الأول
و الوسم | فقط. في المثال التالي قمنا بدمج الخانة الأولى و الثانية الموجودتين في السطر الأول. جدول ثلاث خزانات بالرياض. | A | D | E | في المثال التالي قمنا بدمج الخانة الثانية في السطر الأول مع الخانة الثانية الموجودة تحتها في السطر الثاني.
---|
ID | Name | Mark | 1 | Mhamad Harmush | A | 2 | Rima Houssayni | C | 3 | Youssef Jabber | B |
---|
يمكن دمج خليتين أو أكثر في الصف نفسه أو العمود نفسه ضمن خلية واحدة. على سبيل المثال، يمكنك دمج عدة خلايا أفقياً لإنشاء عنوان جدول يمتد على أعمدة متعددة. حدد الخلايا التي تريد دمجها. ملاحظة: في حال عدم وجود حدود مرئية للخلايا في جدولك، قد تجد أن إظهار خطوط الشبكة قد يكون مفيداً. انقر فوق أدوات الجدول > تخطيط > عرض خطوط الشبكة. انقر بزر الماوس الأيمن فوق الخلايا المحددة، ثم انقر فوق دمج خلايا. هل تحتاج إلى مزيد من المساعدة؟
في كل سطر < tr > تتم الإشارة إلى محتويات الخلايا المختلفة < td >. بشكل تخطيطي ، يتم إنشاء جدول كما في الشكل التالي: جدول يحتوي على 4 سطور و 12 خانة نبدأ بالشــرح: نقول السطـر < tr > هو ما نراه في المثال مرسوم بشكل أفقي ◻️ والذي يضم ثلاث خانات.