انتقل إلى محتوى الدرس

Rowspan Attribute in HTML خاصية Rowspan في لغة HTML

سوف تتعلم في هذا الدرس كيفية دمج خلايا الجدول في لغة HTML، سواء كانت الخلايا في نفس الصف أو نفس العمود.

1 صفوف تعليمية
لغة HTML
12,777 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تُستخدم خاصية [rowspan] لدمج خلايا الجدول رأسياً في لغة HTML، حيث يتم تحديد عدد الخلايا التي سيتم دمجها والتي يجب أن تكون في نفس العمود.

وهذه الخاصية تأخذ قيمة ["rowspan="value] لتحديد عدد الخلايا المدموجة.

قيمة خاصية [rowspan]:

  • يكتب عدد صحيح من 1 إلى 65534 لتحديد عدد الصفوف التي تشغلها الخلية، أو 0 لتمتد حتى نهاية مجموعة الصفوف الحالية. لا تمتد خلية واحدة عبر مجموعتي صفوف مختلفتين.

  • القيمة الافتراضية عند عدم استخدام الخاصية هي 1، مما يعني عدم وجود دمج للخلايا.

  • تُستخدم خاصية rowspan مع عنصري <td> و <th> فقط.

rowspan attribute

دمج خليتين معاً عمودياً باستخدام الخاصية [rowspan]، لاحظ العمود [Study] الأخير في المثال التالي.

HTML
<tr>
      <td>Mohamed</td> 
      <td>Adly</td>
      <td>[email protected]</td>
      <td>33</td>
      <td rowspan="2">PHP</td>
</tr>

Rowspan Attribute with Number Value

استخدام قيمة [3] داخل خاصية rowspan لدمج ثلاثة خلايا معاً على نفس العمود.

HTML
<tr>
      <td>Mohamed</td> 
      <td>Adly</td>
      <td>[email protected]</td>
      <td>33</td>
      <td rowspan="3">PHP</td>
    </tr>

جميع فقرات هذا الدرس (دمج خلايا الجدول في لغة HTML)