How to display Horizontal Lines between Table Rows using CSS?

Horizontal Lines between Table Rows

To display horizontal lines between rows in a table using CSS, specify bottom border for the table cells: td and th.

The CSS code to set border-bottom for table cells th and td is showing in the following.

th, td {
  border-bottom: 1px solid;
}

Examples

1. Border between rows of table

In the following example, we take a table with two columns, three rows, and set the bottom border of the rows with a border of width 1px, and solid style.

index.html

2. Color of the border between rows

We can also specify a color using border-bottom property.

index.html

Conclusion

In this CSS Tutorial, we learned how to use CSS border-bottom property to display lines between the table rows, with examples.