Check out example codes for "html table border". It will help you in understanding the concepts better.

Code Example 1

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

Code Example 2

<!-- How to create a simple table? -->
<table style="width:100%">
  <thead>
    <tr>
      <th>Title 1</th>
      <th>Title 2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Line_1 Column_1</td>
      <td>Line_1 Column_2</td>
    </tr>
    <tr>
      <td>Line_2 Column_1</td>
      <td>Line_2 Column_2</td>
    </tr>
  </tbody>
</table>


<!-- How to use tables to position other elements? -->
<!-- Exemple: put a paragraph in front of an image -->

<table id="begin" cellspacing="15">
	<tr>
		<td>
			<img src="https://..." alt="some_name" height="180" width="180"/>
        </td>
        <td>
          	<h1>Some Header</h1>
          	<dl>Some Title</dl>
          	<p style="width: 70%;">
            text text text text text text text text text text... and more text
            <a href="https://..">a link</a>.</p>
		</td>
	</tr>
</table>

Code Example 3

<table>

       
      <tr>

         
      <th>Month</th>

         
      <th>Savings</th>

       
      </tr>

       
      <tr>

         
      <td>January</td>

         
      <td>$100</td>

       
      </tr>

      </table>

Code Example 4

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}

Code Example 5

<table>
  <tr> <!-- This is the first row -->
    <th>This is the heading</th>
    <th>Next heading to the right</th>
  </tr>
  <tr> <!-- This is the second row -->
    <td>This is where the table data goes</td>
    <td>This is the second columns data</td>
  </tr>
</table>

Code Example 6

html table border

Learn ReactJs, React Native from akashmittal.com