Problem Statement
Which HTML attribute adds borders to a table?
Explanation
The border attribute adds borders to a table and its cells. You can set border to 1 to add a simple border, or to higher numbers for thicker borders. For example, border equals 1 creates a basic border around the table and between cells. However, the border attribute is deprecated in HTML5. Modern web development uses CSS for styling borders instead. Using CSS gives you much more control over border appearance, including color, style, and thickness. You can style borders differently for the table, rows, and individual cells. Common CSS properties include border, border-collapse, border-spacing, and border-color. The border-collapse property is particularly important. Setting it to collapse removes the space between cell borders, creating a cleaner look. Understanding both the legacy HTML border attribute and modern CSS border styling is useful for interviews.
Code Solution
SolutionRead Only
<!-- Old HTML way (deprecated) -->
<table border="1">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
</tr>
</table>
<!-- Modern CSS way (recommended) -->
<style>
table {
border-collapse: collapse;
width: 100%;
}
th, td {
border: 1px solid black;
padding: 8px;
text-align: left;
}
th {
background-color: #f2f2f2;
}
</style>
<table>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>Practice Sets
This question appears in the following practice sets:
