How Can I Add a Bottom Border to Each Row of an HTML Table?

Adding Border to Table Rows

When working with HTML tables, you may encounter the need to add a border to the bottom of each row. However, attempting to do so using inline styles or direct CSS rules can prove ineffective.

To achieve this desired effect, it is crucial to incorporate the border-collapse: collapse attribute into your CSS. This attribute collapses the shared borders between adjacent cells, resulting in a cleaner and more structured table layout. By applying this attribute to the table rule, the CSS rule for the bottom border will take effect as intended.

Example:

table {
  border-collapse: collapse;
}

tr {
  border-bottom: 1pt solid black;
}

This will ensure that every row in the table has a black solid border at the bottom, enhancing the visual appeal and organization of your tabular data.

The above is the detailed content of How Can I Add a Bottom Border to Each Row of an HTML Table?. For more information, please follow other related articles on the PHP Chinese website!