HTML-Course/Tables.html at main · Johnson-SF3639/HTML-Course · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
<!DOCTYPE html>
<html>
    <head>
        <meta charset="uft-8">
        <meta name="keywords" content="assignment, Html, courses, learning">
        <meta name="decription" content="Learning Html">
        <title>Learning HTML</title>
    </head>
    <body>
        <h1>Welcome to our Webpage</h1>
        <hr>
        <table border="1" width="500px" cellpadding="10" cellspacing="5">
            <tr>
                <th>Name</th>
                <th>Department</th>
                <th>Age</th>
            </tr>
            <tr>
                <td>John</td>
                <td>IT</td>
                <td>21</td>
            </tr>
            <tr>
                <td>Siva</td>
                <td>ECE</td>
                <td>22</td>
            </tr>
            <tr>
                <td>Tamil</td>
                <td>MECH</td>
                <td>21</td>
            </tr>
        </table>

        <hr>
        <br>

        <table border="1" width="500px" cellpadding="10" cellspacing="5" bgcolor="lightblue">
            <caption>Split the Table Using Row & Col span</caption>
            <tr>
                <th rowspan="2">Heading 1</th>
                <th colspan="2">Heading 2</th>
            </tr>
            <tr>
                <td>IT</td>
                <td>21</td>
            </tr>
            <tr>
                <td>Siva</td>
                <td>ECE</td>
                <td>22</td>
            </tr>
            <tr>
                <td>Tamil</td>
                <td>MECH</td>
                <td>21</td>
            </tr>
        </table>

        <hr>
        <br>

        <table border="1" width="500px" cellpadding="10" cellspacing="5" background="./img/flower.jpg">
            <caption>Set the Back ground image in the Table</caption>
            <tr>
                <th rowspan="2">Heading 1</th>
                <th colspan="2">Heading 2</th>
            </tr>
            <tr>
                <td>IT</td>
                <td>21</td>
            </tr>
            <tr>
                <td>Siva</td>
                <td>ECE</td>
                <td>22</td>
            </tr>
            <tr>
                <td>Tamil</td>
                <td>MECH</td>
                <td>21</td>
            </tr>
        </table>

        <hr>
        <br>

        <table border="1" width="500px" cellpadding="10" cellspacing="5">
            <caption>Add Header and Footer</caption>
            <thead>
                <tr >
                    <td colspan="3">This is Header</td>
                </tr>
            </thead>
            <tfoot>
                <tr>
                    <td colspan="3">This is Footer</td>
                </tr>
            </tfoot>
            <tr>
                <th>Name</th>
                <th>Department</th>
                <th>Age</th>
            </tr>
            <tr>
                <td>John</td>
                <td>IT</td>
                <td>21</td>
            </tr>
            <tr>
                <td>Siva</td>
                <td>ECE</td>
                <td>22</td>
            </tr>
            <tr>
                <td>Tamil</td>
                <td>MECH</td>
                <td>21</td>
            </tr>
        </table>

    </body>
</html>