HTML Table Generator

Wrap lines

Line numbers

Preview

Heading	Heading	Heading
Cell	Cell	Cell
Cell	Cell	Cell
Cell	Cell	Cell

Properties

Rows (1-99)

Columns (1-99)

Class

Caption

Styling

Width

Width Unit

Border Collapse

Border Width

Border Style

Border Color

Table Background

Header

Header Background

Header Text

Sample Text

Text Color

Footer

Footer Background

Footer Color

Code

<table class="my-table">
  <thead>
    <tr>
      <th>Heading</th>
      <th>Heading</th>
      <th>Heading</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Cell</td>
      <td>Cell</td>
      <td>Cell</td>
    </tr>
    <tr>
      <td>Cell</td>
      <td>Cell</td>
      <td>Cell</td>
    </tr>
    <tr>
      <td>Cell</td>
      <td>Cell</td>
      <td>Cell</td>
    </tr>
  </tbody>  
</table>

CSS

.my-table {
  width: 100%;
  border-width: 1px;
  border-style: solid;
  border-color: #222222;
  border-collapse: separate;
  background-color: #FFFFFF;
  color: #222222;
}

.my-table th, .my-table td {
  border-width: 1px;
  border-style: solid;
  border-color: #222222;
}

.my-table thead {
  background-color: #FFFFFF;
  color: #222222;
}