แทร็กบอก HTML <colgroup> แทร็ก

  • หน้าก่อน <col>
  • หน้าต่อไป <data>

การใช้งานและการเขียน

<colgroup> โซ่อซ่อมใช้เพื่อกำหนดรูปแบบของกลุ่มคอลัมน์ที่มีหนึ่งหรือหลายคอลัมน์ในตาราง

ถ้าต้องการใช้สไตล์สำหรับคอลัมน์ทั้งหมด<colgroup> โซ่อซ่อมนี้มีประโยชน์มาก เพราะไม่จำเป็นต้องใช้สไตล์ซ้ำให้กับแต่ละหน่วยเลขและแต่ละบรรทัด

ข้อเตือน:<colgroup> โซ่อซ่อมต้องเป็น <table> เป็นลูกของเอลิเมนต์ <caption> หลังจากเอลิเมนต์ <thead>、<tbody>、<tfoot> และ <tr> ก่อนเอลิเมนต์

คำเตือน:ถ้าต้องการกำหนด <colgroup> ถ้าต้องการกำหนดคุณสมบัติต่าง ๆ ในคอลัมน์เฉพาะใน <colgroup> ใช้ในโซ่อซ่อม <col> โซ่อซ่อม.

อ่านเพิ่มเติมที่:

คู่มือ HTML ออนไลน์:<col> โซ่อซ่อม

คู่มือ HTML DOM ออนไลน์:วัตถุ ColumnGroup

ตัวอย่าง

ใช้ <colgroup> และ <col> โซ่อซ่อมสีพื้นหลังสามลอยตัว:

<table>
  <colgroup>
    <col span="2" style="background-color:red">
    <col style="background-color:yellow">
  </colgroup>
  <tr>
    <th>หมายเลขหนังสือ</th>
    <th>หัวข้อ</th>
    <th>ราคา</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>HTML มืออาชีพ</td>
    <td>$53</td>
  </tr>
</table>

ทดลองด้วยตัวเอง

ตัวแปร

ตัวแปร ค่า รายละเอียด
span ตัวเลข กำหนดจำนวนคอลัมน์ที่ควรคล้ายตัวกันของกลุ่มคอลัมน์

ตัวแปรโลก

<colgroup> แบบตัวอย่างที่สนับสนุน ตัวแปรโลกใน HTML.

ตัวแปรเหตุการณ์

<colgroup> แบบตัวอย่างที่สนับสนุน ตัวแปรเหตุการณ์ใน HTML.

การตั้งค่า CSS โดยมาก

โดยมากที่สุด โปรแกรมบราวเซอร์จะแสดงค่าเริ่มต้นตามต่อไปนี้ <colgroup> ตัวแปร:

colgroup {
  display: table-column-group;
}

ทดลองด้วยตัวเอง

การสนับสนุนโดยเครื่องนี้

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน
  • หน้าก่อน <col>
  • หน้าต่อไป <data>