How to Create Table in HTML with Border without CSS ?

Last Updated : 12 Jun, 2025

Creating tables in HTML remains an Important skill for over 80% of beginner web developers, especially when it comes to displaying structured data clearly. Tables help organize information into rows and columns, enhancing readability and layout. In this article, we’ll explore how to create a basic HTML table with borders—all without using any CSS styling—focusing solely on native HTML elements.

Step 1: Basic Table Structure

The basic structure of an HTML table consists of the <table> element, which contains rows (<tr> elements), and each row contains cells (<td> elements for data cells or <th> elements for header cells).

Here's a simple example of a table with three rows and three columns:

index.html

<table>
    <tr>
        <th>Header 1</th>
        <th>Header 2</th>
        <th>Header 3</th>
    </tr>
    <tr>
        <td>Data 1</td>
        <td>Data 2</td>
        <td>Data 3</td>
    </tr>
    <tr>
        <td>Data 4</td>
        <td>Data 5</td>
        <td>Data 6</td>
    </tr>
</table>

Step 2: Adding Borders to the Table

To add borders to the table without using CSS, we can use the border attribute directly in the <table> tag. The border attribute specifies the width of the border in pixels.

Here's how you can add a border to the entire table:

<table border="1">
    <!-- Table rows and cells -->
</table>

Complete Code Example

Here's a complete HTML example with a table that has borders:

index.html

<!DOCTYPE html>
<html>
<head>
    <title>HTML Table with Border</title>
</head>
<body>
    <table border="1">
        <tr>
            <th>Header 1</th>
            <th>Header 2</th>
            <th>Header 3</th>
        </tr>
        <tr>
            <td>Data 1</td>
            <td>Data 2</td>
            <td>Data 3</td>
        </tr>
        <tr>
            <td>Data 4</td>
            <td>Data 5</td>
            <td>Data 6</td>
        </tr>
    </table>
</body>
</html>

Output