HTML Table Borders

HTML tables can have borders defined in a number of ways. Here are a few options:

  1. Using the border attribute:

You can add a border to an HTML table by using the border attribute in the <table> tag. The value of the attribute specifies the width of the border, in pixels.

For example:

<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>
</table>

This will create a table with a border of 1 pixel width.

  1. Using CSS:

You can also use CSS to define the borders of a table. This gives you more control over the style and appearance of the border. Here’s an example:

<style>
  table {
    border-collapse: collapse;
    border: 2px solid black;
  }
  th, td {
    border: 1px solid black;
    padding: 8px;
    text-align: left;
  }
</style>
<table>
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
  </tr>
  <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>
</table>

This will create a table with a black border of 2 pixels width around the outside, and black borders of 1 pixel width around each cell.

  1. Using border-style property:

You can use the border-style property to define the style of the border. For example, you can use the dashed value to create a dashed border:

<style>
  table {
    border-collapse: collapse;
  }
  td {
    border: 2px dashed black;
    padding: 8px;
    text-align: left;
  }
</style>
<table>
  <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>
</table>

This will create a table with a dashed border of 2 pixels width around each cell.

You may also like...

Popular Posts

Leave a Reply

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