☄ EXPOLORE MIND ⚜ Tutorial ? JIQA Biography News
PRV MENU NEXT

Nesting Tables in HTML 5

22-01-18 Course- HTML5-Simple

Nesting tables mean creating a table within another table, Suppose, you want to create a table such that it contains a table within it, which in turn includes another able, then in this situation, you can do nesting of all the tables.

Let’s do the following steps to do the nesting of table:


<!DOCTYPE html>
<head>
    <title>Example of Nestting Table</title>
</head>
<body bgcolor=”alicablue”>
<table border=”1” align=”center” >
<caption>
    <h2>Student Details</h2>
</caption
    <tr>
        <td>
        <table border="1" bgcolor="pink">
            <tr>
                <th>Name</th>
                <th>Date of Birth</th>
                <th> Address</th>
            </tr>
            <tr>
                <td>Sumit Kumar</td>
                <td>15.03.1985</td>
                <td>Flat No. 301, Shipra Suncity, Ghaziabad</td>
            </tr>
            <tr>
                <td>Amitabh Kumar</td>
                <td>15.03.1985</td>
                <td>Flat No. 301, Shipra Suncity, Ghaziabad</td>
            </tr>
            <tr>
                <td>Rohit Kumar</td>
                <td>15.03.1985</td>
                <td>Flat No. 301, Shipra Suncity, Ghaziabad</td>
            </tr>
            <tr>
                <td>Avantika Kumar</td>
                <td>15.03.1985</td>
                <td>Flat No. 301, Shipra Suncity, Ghaziabad</td>
            </tr>        
        </table>
        </td>

        <td>
        <table border="1" bgcolor="silver">
            <tr>
                <th>Lnd Line No.</th>
                <th>Mobile No.</th>
            </tr>
            <tr>
                <td>011-451485451</td>
                <td>9574445852</td>
            </tr>
            <tr>
                <td>011-451485451</td>
                <td>9574445852</td>
            </tr>
            <tr>
                <td>011-451485451</td>
                <td>9574445852</td>
            </tr>
            <tr>
                <td>011-451485451</td>
                <td>9574445852</td>
            </tr>        
        </table>
        </td>
    
    </tr>

</table>
</body>
</html>

Save the document the name of NestingTable.html. Open the document on browser.

Create nested table in html 5

Let’s now learn to work with frames. Go through next button:

PRV MENU NEXT