How to Make a Table Without Border in HTML

Table without border in HTML. The table without border is a layout landscape of the webpage applying an HTML table. The use of the table analyzes the performance of the extensive data in the easiest form.

We know, A Table with or without borders is used for connection between the details. Textual and numerical data can be represented in tabular format.

In the HTML webpage, a number of the table structure can be performed without the border. BY, Using the border in the table layout is minors on its uses. A table design on the webpage can be built using the following HTML.

HTML Code

<table>
<thead>
<th>Serial.No</th>
<th>Full Name</th>
<th>DOB</th>
<th>Basic</th>
<th>Pay</th>
</thead>
<tbody>
<tr>
<td>1</td><td>Muhamamd Rauf</td>
<td>21</td>
<td>Web Develoepr</td>
<td>150,000.00</td>
</tr>
<tr>
<td>2</td>
<td>Mehro Nisa</td>
<td>17</td>
<td>Manager at SCO</td>
<td>54,000</td>
</tr>
<tr>
<td>3</td>
<td>Muhammad Ali</td>
<td>20</td>
<td>Assistant at SCO</td>
<td>25,000</td>
</tr>
</tbody>
</table>

In the above-given Output, the border is not displayed. By default, the border rests unavailable in the tabular layout. To allow the border in the table, require to add a styled border, This border will include three elements such as the size of the border (like as in px), type of the border (like as groove, thin, solid, etc), and the third one is the color (such as black, brown, purple, green, color code).

CSS table without border

By using CSS style table will look better to see.

table th, table td{
font-size:20px;
text-align: center;
}
tbody tr:nth-child(even) {
background: #eee;
}

`Conclusion

A table without a Border is one of the forms of the table design. The table design can also be performed using other HTML tags like li, and DIV, but the use of a table for tabular construction decreases the styling work while the use of div for table design is rising due to the responsive layout appearance.