Horje
What is HTML Table Colgroup

The <colgroup> element is used to style specific columns of a table.

If you want to style the two first columns of a table, use the <colgroup> and <col> elements.


Full Example of HTML Table Colgroup

The <colgroup> element should be used as a container for the column specifications. Each group is specified with a <col> element. The span attribute specifies how many columns that get the style. The style attribute specifies the style to give the columns.
index.html
Example: HTML
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}
</style>
</head>
<body>

<h2>Colgroup</h2>
<p>Add the a colgroup with a col element that spans over two columns to define a style for the two columns:</p>

<table style="width: 100%;">
<colgroup>
  <col span="2" style="background-color: #D6EEEE">
</colgroup>
<tr>
<th>MON</th>
<th>TUE</th>
<th>WED</th>
<th>THU</th>
<th>FRI</th>
<th>SAT</th>
<th>SUN</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
<tr>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
</tr>
<tr>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
</table>

</body>
</html>

Output should be:

Full Example of HTML Table Colgroup

Note: The <colgroup> tag must be a child of a <table> element and should be placed before any other table elements, like <thead>, <tr>, <td> etc., but after the <caption> element, if present.
Reffered: https://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_colgroup1





Related Articles
What is HTML Table Colgroup HTML Table Colgroup
How to create HTML Multiple Col Elements HTML Table Colgroup
How to create HTML Table Empty Colgroups HTML Table Colgroup
How to Hide Columns of HTML Table HTML Table Colgroup

Single Articles
Full Example of HTML Table ColgroupHTML Table Colgroup

Read Full:
HTML Table Colgroup
Category:
Web Tutorial
Sub Category:
HTML Table Colgroup
Uploaded:
1 year ago
Uploaded by:
Admin
Views:
48



Share on: