Vertical Table Headers

#	Content	Views
1.	Tutorial Tags	40,087
2.	Tutorial + Programming	1,135,280
3.	Videos	377,889
4.	Results (`Annual + Re-appear`)	47,778
5.	Quiz Chapters	39,009
6.	Quiz Questions	564,250
7.	Quiz Results	30,295
8.	Testimonials	8,206
9.	Projects	34,470
10.	e-Words	23,654
11.	e-Certificates	4,968
12.	Downloads (Softwares)	166,372
13.	Downloads (Syllabus)	2,778

Home
HTML
Tables
Vertical Table Headers

Vertical Table Headers

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

<!DOCTYPE html>
<html>
<head>
<title>Vertical Table Headers</title>
</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>Taranpreet</td>
    <td>Mehakpreet</td>
  </tr>
  <tr>
    <th>Lastname</th>
    <td>Singh</td>
    <td>Kaur</td>
  </tr>
  <tr>
    <th>Class</th>  
    <td>6th</td>
    <td>7th</td>
  </tr>
</table>

</body>
</html>

Live Demo & Try it yourself!

Output

YouTube » » https://www.youtube.com/watch?v=Mbo8FSNVADc

#table #headers #vertical

CSPunjab.Com

Vertical Table Headers

« Previous

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

<!DOCTYPE html>
<html>
<head>
<title>Vertical Table Headers</title>
</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>Taranpreet</td>
    <td>Mehakpreet</td>
  </tr>
  <tr>
    <th>Lastname</th>
    <td>Singh</td>
    <td>Kaur</td>
  </tr>
  <tr>
    <th>Class</th>  
    <td>6th</td>
    <td>7th</td>
  </tr>
</table>

</body>
</html>