HTML Tables



HTML table tag an arrangement of data in columns and rows and other strectures.Tables are mostly used in data analysis and research.

To create a HTML table to display data in this time we are using <table> tag, with the help of <tr> , <td> , <th> elements.

In this Tutorial Provides all the table tags in One example is given below.


HTML Table Tag

Example

<!DOCTYPE html>
    <html>
    <head>
    <title>HTML table Tag</title>
    <style type="text/css">
        table, td, th {
            border: 1px solid red;
        }
    </style>
    </head>
    <body>
        <table>
            <caption>User Details</caption>
            <thead>
                <tr>
                    <th>No.</th>
                    <th>Name</th>
                    <th>Email</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>Alura</td>
                    <td>alura@mail.com</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>John</td>
                    <td>john@mail.com</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td>Milinda</td>
                    <td>milida@mail.com</td>
                </tr>
            </tbody>
        </table>
    </body>
    </html>
    


Click on the "Run This Code" button to see how it works.


HTML <th> Tag

<th> - Table heading.

It is used to represent to actual data header cell.

Example

<!DOCTYPE html>
<html>
<head>
<title>HTML table Tag</title>
<style type="text/css">
    table, td, th {
        border: 1px solid red;
    }
</style>
</head>
<body>
    <table>
        <caption>User Details</caption>
        <thead>
            <tr>
                <th>No.</th>
                <th>Name</th>
                <th>Email</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td>
                <td>Alura</td>
                <td>alura@mail.com</td>
            </tr>
            <tr>
                <td>2</td>
                <td>John</td>
                <td>john@mail.com</td>
            </tr>
            <tr>
                <td>3</td>
                <td>Milinda</td>
                <td>milida@mail.com</td>
            </tr>
        </tbody>
    </table>
</body>
</html> 


Click on the "Run This Code" button to see how it works.


HTML <td> Tag

<td> - Tht td tag used for specifying a cell or table data with in a table.

Example

<!DOCTYPE html>
    <html>
    <head>
    <title>HTML table Tag</title>
    <style type="text/css">
        table, td, th {
            border: 1px solid red;
        }
    </style>
    </head>
    <body>
        <table>
            <caption>User Details</caption>
            <thead>
                <tr>
                    <th>No.</th>
                    <th>Name</th>
                    <th>Email</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>Alura</td>
                    <td>alura@mail.com</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>John</td>
                    <td>john@mail.com</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td>Milinda</td>
                    <td>milida@mail.com</td>
                </tr>
            </tbody>
        </table>
    </body>
    </html>
    


Click on the "Run This Code" button to see how it works.






HTML

Welcome HTML Getting Started HTML Elements HTML Attributes HTML Headings HTML Paragraphs HTML Links HTML Styles HTML Text Formatting HTML Tables HTML Images HTML Forms HTML Lists HTML Iframes HTML Comments HTML CSS HTML Colors HTML Classes HTML Id HTML javascript HTML Filepaths

HTML Advanced

HTML Doctypes HTML Validation HTML Validation HTML URL HTML URL Encode HTML URL Entities HTML Layout HTML Head HTML Meta HTML Scripts HTML Tags

HTML Media

HTML Media HTML Audio HTML Video HTML Plug-ins HTML Youtube

HTML Graphics

HTML Canvas HTML SVG