HTML table generator

This online HTML table generator tool allows you to easily create HTML tables with the desired settings. Simply fill in all required properties of the table on the right side and click on the "Generate" button. The preview table will be generated below. Even more down you will find a code that you can copy and use wherever you want.

Enter HTML Table properties and press the Generate Table button:

px
px
px
Click on table to enter table data:
Table 1
Header 1 Header 2 Header 3 Header 4
       
       
       
       


HTML Table tags syntax

Define HTML table

  • The <table> tag defines an HTML table.
  • Each table row is defined with a <tr> tag. Each table header is defined with a <th> tag. Each table data/cell is defined with a <td> tag.
  • By default, the text in <th> elements are bold and centered.
  • By default, the text in <td> elements are regular and left-aligned.

HTML Table - Add a Border

To add a border to a table, use the CSS border property:

table, th, td {
  border: 1px solid black;
}

HTML Table - Collapsed Borders

To let the borders collapse into one border, add the CSS border-collapse property:

table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}

HTML Table - Add Cell Padding

  • Cell padding specifies the space between the cell content and its borders.
  • If you do not specify a padding, the table cells will be displayed without padding.
  • To set the padding, use the CSS padding property:
th, td {
  padding: 15px;
}

HTML Table - Left-align Headings

  • By default, table headings are bold and centered.
  • To left-align the table headings, use the CSS text-align property:
th {
  text-align: left;
}

HTML Table - Add Border Spacing

  • Border spacing specifies the space between the cells.
  • To set the border spacing for a table, use the CSS border-spacing property:
table {
  border-spacing: 5px;
}

Note: If the table has collapsed borders, border-spacing has no effect.

HTML Table - Cell that Spans Many Columns

To make a cell span more than one column, use the colspan attribute:

<table style="width:100%">
  <tr>
    <th>Name</th>
    <th colspan="2">Telephone</th>
  </tr>
  <tr>
    <td>Bill Gates</td>
    <td>55577854</td>
    <td>55577855</td>
  </tr>
</table>

HTML Table - Cell that Spans Many Rows

To make a cell span more than one row, use the rowspan attribute:

<table style="width:100%">
  <tr>
    <th>Name:</th>
    <td>Bill Gates</td>
  </tr>
  <tr>
    <th rowspan="2">Telephone:</th>
    <td>55577854</td>
  </tr>
  <tr>
    <td>55577855</td>
  </tr>
</table>

HTML Table - Add a Caption

To add a caption to a table, use the <caption> tag:

<table style="width:100%">
  <caption>Monthly savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$50</td>
  </tr>
</table>

Note: The <caption> tag must be inserted immediately after the <table> tag.

A Special Style for One Table

To define a special style for one particular table, add an id attribute to the table:

<table id="t01">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>
Now you can define a special style for this table:
#t01 {
  width: 100%;
  background-color: #f1f1c1;
}
And add more styles:
#t01 tr:nth-child(even) {
  background-color: #eee;
}
#t01 tr:nth-child(odd) {
  background-color: #fff;
}
#t01 th {
  color: white;
  background-color: black;
}


Currently, we have around 945 calculators, conversion tables and usefull online tools and software features for students, teaching and teachers, designers and simply for everyone.

You can find at this page financial calculators, mortgage calculators, calculators for loans, calculators for auto loan and lease calculators, interest calculators, payment calculators, retirement calculators, amortization calculators, investment calculators, inflation calculators, finance calculators, income tax calculators, compound interest calculators, salary calculator, interest rate calculator, sales tax calculator, fitness & health calculators, bmi calculator, calorie calculators, body fat calculator, bmr calculator, ideal weight calculator, pace calculator, pregnancy calculator, pregnancy conception calculator, due date calculator, math calculators, scientific calculator, fraction calculator, percentage calculators, random number generator, triangle calculator, standard deviation calculator, other calculators, age calculator, date calculator, time calculator, hours calculator, gpa calculator, grade calculator, concrete calculator, subnet calculator, password generator conversion calculator and many other tools and for text editing and formating, downloading videos from Facebok (we built one of the most famous Facebook video downloader online tools). We also provide you online downloanders for YouTube, Linkedin, Instagram, Twitter, Snapchat, TikTok and other social media sites (please note we does not host any videos on its servers. All videos that you download are downloaded from Facebook's, YouTube's, Linkedin's, Instagram's, Twitter's, Snapchat's, TikTok's CDNs. We also specialise on keyboard shortcuts, ALT codes for Mac, Windows and Linux and other usefull hints and tools (how to write emoji online etc.)

There are many very usefull online free tools and we would be happy if you share our page to others or send us any suggestions for other tools which will come on your mind. Also in case you find any of our tools that it does not work properly or need a better translation - please let us know. Our tools will make your life easier or simply help you to do your work or duties faster and in more effective way.

These below are the most commonly used by many users all over the world.

And we are still developing more. Our goal is to become the one-stop, go-to site for people who need to make quick calculations or who need to find quick answer for basic conversions.

Additionally, we believe the internet should be a source of free information. Therefore, all of our tools and services are completely free, with no registration required. We coded and developed each calculator individually and put each one through strict, comprehensive testing. However, please inform us if you notice even the slightest error – your input is extremely valuable to us. While most calculators on Justfreetools.com are designed to be universally applicable for worldwide usage, some are for specific countries only.


Page Id: 1528

This website uses cookies to improve your experience, analyze traffic and display ads. Learn more