Scribd
Upload
8 views2 pages

HTML Program

This HTML program demonstrates the usage of the <table> tag with various attributes. It creates a table with three rows and four columns, including features like cell merging, a caption, and styled headers. The table is formatted with attributes such as border, cellpadding, cellspacing, and bgcolor to enhance its appearance.

Uploaded by

goudakhilesh47
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
8 views2 pages

HTML Program

This HTML program demonstrates the usage of the <table> tag with various attributes. It creates a table with three rows and four columns, including features like cell merging, a caption, and styled headers. The table is formatted with attributes such as border, cellpadding, cellspacing, and bgcolor to enhance its appearance.

Uploaded by

goudakhilesh47
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

Write an HTML program to demonstrate the usage of the <table> tag and its

attributes. Include the following requirements in your program:

1. Create a table with three rows and four columns.


2. Use attributes such as border, cellpadding, cellspacing, and width to style the
table.
3. Assign appropriate values to the align, valign, and bgcolor attributes for
specific table cells.
4. Merge two cells in a row using the colspan attribute and two rows in a column
using the rowspan attribute.
5. Add a caption to the table.
6. Include a descriptive header row using the <th> tag.
Ensure the program includes comments to explain the purpose of each section of
code.

Program:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Table Tag Example</title>
<style>
body {
font-family: Arial, sans-serif;
}
</style>
</head>
<body>
<h1>Table Tag with Attributes</h1>
<!-- Table with border, cellspacing, cellpadding, and width -->
<table border="1" cellspacing="5" cellpadding="10" width="80%"
align="center" bgcolor="#f9f9f9">
<!-- Caption for the table -->
<caption><strong>Sample Table with Attributes</strong></caption>

<!-- Header Row -->


<tr bgcolor="#d3d3d3">
<th>S.No</th>
<th>Name</th>
<th>Age</th>
<th>Remarks</th>
</tr>

<!-- First Row -->


<tr>
<td align="center" valign="middle">1</td>
<td align="left">Alice</td>
<td align="center" valign="middle" bgcolor="#ffcccb">25</td>
<td align="center">Excellent</td>
</tr>

<!-- Second Row -->


<tr>
<td align="center" valign="middle">2</td>
<!-- Merged Cell -->
<td colspan="2" align="center" bgcolor="#d5f4e6">Merged Cells</td>
<td align="center">Good</td>
</tr>

<!-- Third Row -->


<tr>
<!-- Merged Rows -->
<td rowspan="2" align="center" valign="middle" bgcolor="#e1bee7">3</td>
<td align="left">Charlie</td>
<td align="center" valign="middle">22</td>
<td align="center">Average</td>
</tr>
<tr>
<td align="left">Diana</td>
<td align="center" valign="middle">24</td>
<td align="center">Good</td>
</tr>
</table>
</body>
</html>

You might also like