HTML<Table> Border Attribute

In our last tutorial we have learnt how to create table without borders. In this tutorial, we will show you how to create table with border using HTML code. We will use keep enhancing the same code in our series of HTML tutorials in that way you will be able to understand the significance of new table attributes and tags

Before going further into details, it is important to understand the meaning of border.  The border is the line around the table and between the cells; it’s a good practice to use it in table for more clear view of data in table cells.

The border attribute in HTML tags has default value of “1” increasing the number will make the border wider around the table but the division between the cells still remain 1 pixel.

HTML code to add border in table.

<Table border = “1”>

Where border is the attribute of Table and 1 is the value of border which tell the browsers to put 1 pixel border around the table and between the cells.
Let take the previous tutorial HTML code of 3 X 2 tables and enhance it by adding the border attribute.

<Html>

<head>

<title>

</title>

</head>

<body>

Now you can see the table with border

<table border = “1”>

<tr>

<td>

Row 1, Column 1

</td>

<td>

Row 1, Column 2

</td>

</tr>

<tr>

<td>

Row 2, Column 1

</td>

<td>

Row 2, Column 2

</td>

</tr>

<tr>

<td>

Row 3, Column 1

</td>

<td>

Row 3, Column 2

</td>

</tr>

</table>

</body>

</html>


Save the file in .htm format, open it in browser and you will see the output as mentioned below.

image

Tags: , , , ,

Author: Revo

Share This Post On

Submit a Comment

Your email address will not be published. Required fields are marked *

three + nine =

 

Pin It on Pinterest

Shares
Share This