دمج خلايا الجدول
تستخدم الخاصية” “colspan=, والخاصية” “rowspan=, والتي توضع في العلامة الخاصة بالخلية<td…..> في دمج خلايا الجدول أفقياً أورأسياً، وتأخذ هذه الخاصية قيمة تعبر عن عدد الخلايا التي يتم دمجها, فالخاصية colspan” ” تقوم بدمج خلايا الجدول بشطل رأسي, أي دمج أعمدة الجدول, أما الخاصية rowspan تقوم بدمج خلايا الجدول بشكل أفقي , أي دمج صفوف الجدول.
والكود التالي يوضح كيفية دمج اعمدة الجدول في عمود واحد في الخلية, أي دمج الخلايا1و2و3معاً:
- قم بتشغيل برنامج notepad واكتب به نص ملف htmlكما في الشكل التالي:
ويكتب الكود السابق في العلامة الخاصة بالخلية رقم1, وبالتالي لايكتب الكود الخاص بالخلية رقم2, والخلية رقم3 لدمجها في الخلية رقم1, كما في المثال التالي:
انظر فيما سبق على الكود الخلية رقم1, لقد تم دمج ثلاثة خلايا في هذه الخلية, وبالتالي تم إزالة الكود الخاص بالخلية رقم2, والخلية رقم3, وبالتالي يتم دمج خلايا اجدول الثلاثة الموجودة في الصف الأول.
- قم بحفظ المستند بامتداد html. وقم بفتح المستند في متصفح الإنترنت فتحصل على الشكل التالي:
أما الكود التالي فيستخدم في دمج الخلايا رقم3 و6 و9, ويكتب هذا الكود في العلامة الخاصة بالخلية الثلاثة, وبالتالي يتم إزالة الأكواد الخاصة بإنشاء الخلايا 6 و9.
والكود التالي يوضح كيفية دمج الخلايا رقم 3، 6، 9 في الخلية الثالثة:
- قم بحفظ المستند بامتداد html. وقم بفتح المستند في متصفح الإنترنت فتكون النتيجة هي دمج الخلايا رقم 3 و6 و9 في الخلية رقم 3، كما يوضح الشكل التالي:
