how to make vertical line code example

Example 1: how to make vertical line in html

<style>
.vl {
  border-left: 6px solid green;
  height: 
  500px;
}

  </style>

<div class="vl"></div>

Example 2: how to make a vertical line on html

<table class="table table-bordered table-dark">
  <thead>
    <tr>
      <th scope="col">#</th>
      <th scope="col">First</th>
      <th scope="col">Last</th>
      <th scope="col">Handle</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">1</th>
      <td>Mark</td>
      <td>Otto</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <th scope="row">2</th>
      <td>Jacob</td>
      <td>Thornton</td>
      <td>@fat</td>
    </tr>
    <tr>
      <th scope="row">3</th>
      <td colspan="2">Larry the Bird</td>
      <td>@twitter</td>
    </tr>
  </tbody>
</table>

Example 3: vertical line

const data = [1, 2, 3, 4, 5, 6];

const Demo = ({ items }) => (
  <ul>
    {
      items.map(key => (
        <li key={key}>item{key}</li>
      ))
    }
  </ul>
);

ReactDOM.render(
  <Demo items={data} />,
  demo
);