Horje
How to create HTML Vertical Table Headers

To use the first column as table headers, define the first cell in each row as a <th> element:


Basic Example of HTML Vertical Table Headers

 <table>
  <tr>
    <th>Firstname</th>
    <td>Jill</td>
    <td>Eve</td>
  </tr>
  <tr>
    <th>Lastname</th>
    <td>Smith</td>
    <td>Jackson</td>
  </tr>
  <tr>
    <th>Age</th>
    <td>94</td>
    <td>50</td>
  </tr>
</table> 

Full Example of HTML Vertical Table Headers

The first column becomes table headers if you set the first table cell in each table row to a TH element:
index.html
Example: HTML
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}
</style>
</head>
<body>

<h2>Vertical Table Headers</h2>

<p>The first column becomes table headers if you set the first table cell in each table row to a TH element:</p>

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <td>Jill</td>
    <td>Eve</td>
  </tr>
  <tr>
    <th>Lastname</th>
    <td>Smith</td>
    <td>Jackson</td>
  </tr>
  <tr>
    <th>Age</th>  
    <td>50</td>
    <td>94</td>
  </tr>
</table>

</body>
</html>

Output should be:

Full Example of HTML Vertical Table Headers
Reffered: https://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_th_vertical





Related Articles
What is HTML Table Headers HTML Table Headers
How to create Table Headers in HTML HTML Table Headers
How to create HTML Vertical Table Headers HTML Table Headers
How to create HTML Align Table Headers HTML Table Headers
How to create HTML Header for Multiple Columns HTML Table Headers
How to create HTML Table Caption HTML Table Headers

Single Articles
Basic Example of HTML Vertical Table HeadersHTML Table Headers
Full Example of HTML Vertical Table HeadersHTML Table Headers

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



Share on: