يجب استخدام عنصر <col> داخل عنصر <colgroup> لتحديد لون الخلفية لهذا العمود.
تُستخدم خاصية span مع عنصر <col> لتحديد عدد الأعمدة التي سيتم تطبيق التنسيق عليها، مثل: <"col span="2>.
من خلال خاصية bgcolor، يمكننا تلوين خلفية الأعمدة، مثال: "bgcolor="yellow.

Table Colgroup Element

استخدام الخاصية bgcolor والخاصية span مع عنصر <col> وذلك ضمن عنصر <colgroup>، حيث تكون قيم الخاصية bgcolor عبارة عن ألوان، بينما تكون قيم الخاصية span عبارة عن عدد الأعمدة التي سنطبق عليها التنسيق.

<colgroup>
  <col span="3" bgcolor="yellow">
</colgroup>

جربها بنفسك

Using <colgroup> to Apply Different Colors to Table Columns

استخدام خاصية bgcolor لإضافة لون مختلف لخلفية كل عمود في الجدول بشكل منفرد.

<colgroup>
  <col bgcolor="yellow">
  <col bgcolor="blue">
  <col bgcolor="red">
  <col bgcolor="green">
  <col bgcolor="pink">
</colgroup>

جربها بنفسك

<Customizing Specific Column Colors In A Table With <Colgroup

استخدام خاصية bgcolor لتطبيق لون على خلفية كل عمود من الجدول إلا العمود الأخير.

<colgroup>
  <col bgcolor="yellow">
  <col bgcolor="blue">
  <col bgcolor="red">
  <col bgcolor="green">
</colgroup>

جربها بنفسك

ملاحظات

خاصية span غير مدعومة في الإصدار الأخير من لغة HTML الذي هو HTML5.
يرجى ملاحظة أن خاصية bgcolor تعتبر قديمة ويفضل استخدام CSS لتلوين الخلفيات.

</> The Element Caption Within the Table Element in HTML
عنصر Caption داخل عنصر Table في HTML

يُستخدم عنصر <caption> لإضافة شرح وتوضيح حول الجدول في HTML.

يجب وضع عنصر <caption> مباشرة بعد علامة الفتح لعنصر <table>.
سيتم تلقائياً توسيط النصوص الموجودة داخل عنصر <caption> في الجدول.

جربها بنفسك

Incorporating the Caption Element in HTML Tables

يجب إضافة عنصر caption داخل الجدول مباشرة بعد علامة الفتح لعنصر table.

<caption>Our Users</caption>

جربها بنفسك

</> Nested Tables in HTML
الجداول المتداخلة في HTML

يمكن إنشاء جداول متداخلة في HTML، [أي وضع جدول داخل جدول آخر]، عن طريق إنشاء جدول جديد داخل أي خلية من خلايا الجدول الرئيسي.

HTML Table Row With Multiple Data Cells

صف جدول بلغة HTML يحتوي على ثلاث خلايا بيانات.

<tr>
  <td>Nested Table Data 1</td>
  <td>Nested Table Data 2</td>
  <td>Nested Table Data 3</td>
</tr>

جربها بنفسك

Another Elements Inside Table

يمكن إضافة صور وروابط أو إي عنصر من عناصر HTML داخل الجدول.

<tr>
      <td>Table Data 1</td>
      <td>
        <a href="#">Table Data 2</a>
      </td>
      <td><img src="https://www.closetag.com/images/photo6.jpg" alt="Natural" width="100"></td>
      <td>Table Data 4</td>
</tr>

جربها بنفسك

معلومات تهمك

لا تنس تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
لا تنس مشاركة الموقع مع أصدقائك حتى تعمّ الفائدة وتكون سببًا في نفعهم.

عدد المشاركات

التالى

CLOSETAG

منصة كلوز تاج التعليمية المتخصصة في تعليم هندسة البرمجيات. نسعى لتقديم تجربة تعلم فريدة من خلال معسكراتنا العملية والمنظمة والمتسلسلة كما نهدف إلى تقليص الفجوة بين النظرية والتطبيق العملي؛ لذا فإننا نركز على التعليم القائم على المشاريع والتطبيقات الحقيقية. ننقل لك سنوات من الخبرة في أقل وقت ممكن تحت إشراف مهندسين عباقرة عملوا في أكبر الشركات العربية والعالمية في مجال هندسة البرمجيات. مهمتنا ليست فقط تعليم هندسة البرمجيات، بل نسعى أيضًا لتزويدك بمجموعة من المهارات التي تتوافق مع احتياجات سوق العمل.

HTML Table Nested Elements
العناصر الداخلية لعنصر table في لغة HTML

التاريخ

الدروس

المستوى

اللغة

المشاهدات

المواضيع

الشروحات HTML Table Nested Elements HTML