Create A Table Using HTML

Create A Table Using HTML

In this Blog Article we will learn how to create a Table with HTML.

Well in the old days , where CSS was not born yet, basically The table is widely used to Style and arrange content .

Even though fast forward to  now, people rarely used table , as there are plugin and CSS , we must at least have a basic understanding on how to create a Table

Step by Step Creating a Table using HTML

Step 1

Create the Table Tag

<table class=”table table-bordered”>


Step 2

Your table need a head and a body

<table class=”table table-bordered”>


< /thead>




Step 3

Put the main content into the head and body , <tr> stands for row <td>stands for column.<td> are always assign within the row .

<table class=”table table-bordered”>
<tr class=”success”>
<th style=”text-align: center;”>No</th>
<th style=”text-align: center;”>School</th>
<th style=”text-align: center;”>MBA</th>
<th style=”text-align: center;”>Cost</th>
<td rowspan=”1″>1</td>
<td>anyang Technology University</td>
<td>Nanyang-Waseda Double MBA Full Time</td>
<td>S$ 70,000</td>


Styling your Table.

Put the Styling part within the head of your HTML .

  • First Style your Table Fonts
  • Style the Table border
  • Style the table width
  • Style the table column, border,
  • Style the table background color

table {
font-family:”Times New Roman”, Georgia, Serif;
border-collapse: collapse;
width: 100%;

td, th {
border: 1px solid #dddddd;
text-align: left;
padding: 10px;

tr:nth-child(even) {
background-color: #dddddd;


Hopefully after this tutorial , you got an idea  Create A Table Using HTML.

Check out how to create a Paragraph and list Here.




Leave a Comment

3 × five =