Apply CSS border property create the following table. Give proper caption for the table
and do the following:-
a. Left Align the text, border spacing of 5px and cell padding of 15px
b. Use row span and Column span
<!DOCTYPE html>
<html>
<head>
<title>Table Example</title>
<style>
table {
border-collapse: separate;
border-spacing: 5px;
caption-side: top;
padding: 15px;
}
th, td {
border: 1px solid black;
padding: 15px;
text-align: left;
}
</style>
</head>
<body>
<table>
<caption>My Table</caption>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
</tr>
<tr>
<td>Priya</td>
<td>Arjun</td>
<td>Sam</td>
</tr>
<tr>
<td>Sharma</td>
<td>Singh</td>
<td>Watson</td>
</tr>
<tr>
<td> 24 </td>
<td> 32 </td>
<td> 41 </td>
</tr>
</table&#
</body>
</html>
With Css
<!DOCTYPE html>
<html>
<head>
<title>Table Example</title>
<style>
table {
border-collapse: separate;
border-spacing: 5px;
caption-side: top;
padding: 15px;
}
th, td {
border: 1px solid black;
padding: 15px;
text-align: left;
}
</style>
</head>
<body>
<table>
<caption>My Table</caption>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
</tr>
<tr>
<td>Priya</td>
<td>Arjun</td>
<td>Sam</td>
</tr>
<tr>
<td>Sharma</td>
<td>Singh</td>
<td>Watson</td>
</tr>
<tr>
<td> 24 </td>
<td> 32 </td>
<td> 41 </td>
</tr>
</table&#
</body>
</html>
Save the code in an HTML file, and you can open it in a web browser to see your biodata webpage. Remember to include your photo file (e.g., your_photo.jpg) in the same directory as the HTML file or provide the correct file path in the src attribute of the img tag.