Blog Detail

Home Blog Detail

How to create table in HTML?

Blog Img

To create a table in HTML, you can use the <table> element, along with other elements such as <tr> (table row), <th> (table header), and <td> (table data).

It allow you to arrange data into rows and columns on a web page, making it easy to display information like schedules, statistics, or other structured data in a clear format.

·  <table>: Defines the start of the table.

·  <thead>: Used for the header section

·  <tr>: Defines a row in the table.

·  <th>: Defines a header cell

·  <td>: Defines a standard data cell.

table.html

<table class="custom-table">
    <thead>
        <tr>
            <th>S.No</th>
            <th>Name</th>
            <th>Age</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>Raja</td>
            <td>25</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Ravi</td>
            <td>30</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Hari</td>
            <td>20</td>
        </tr>
    </tbody>
</table>

style.css

body {
	font-family: Arial, Helvetica, sans-serif;
}

.custom-table {
	width: 50%;
	border: 1px solid #333;
	border-collapse: collapse;
	margin: auto;
}

.custom-table tr th,
.custom-table tr td {
	border: 1px solid #333;
	padding: 10px;
	font-size: 14px;
}

.custom-table tr td {
	text-align: center;
}

Output:

© 2025Think4u. All Rights Reserved.