<table>
    <thead>
      <tr>
        <th>번호</th>
        <th>이름</th>
        <th>나이</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>1번</td>
        <td>김철수</td>
        <td>23살</td>
      </tr>
      <tr>
        <td>2번</td>
        <td>김백수</td>
        <td>21살</td>
      </tr>
      <tr>
        <td>3번</td>
        <td>홍길동</td>
        <td>25살</td>
      </tr>
      <tr>
        <td>4번</td>
        <td>아무개</td>
        <td>20살</td>
      </tr>
    </tbody>
  </table>  

table {
  border-collapse: collapse;
  width: 500px;
  margin: 1rem auto;
  border: 1px solid #ddd;
  background-color: white;
}

/* 테이블 행 */
th, td {
  padding: 8px;
  text-align: left;
  border-bottom: 1px solid #ddd;
  text-align: center;
}

th {
  background-color: #1b1b1b;
  color: #ddd;
}

/* 테이블 올렸을 때 */
tbody tr:hover {
  background-color: #d3d3d3;
  opacity: 0.9;
  cursor: pointer;
}

/* 테이블 비율 */
th:nth-child(1),
td:nth-child(1) {
  width: 15%;
}

th:nth-child(2),
td:nth-child(2) {
  width: 55%;
}

th:nth-child(3),
td:nth-child(3) {
  width: 30%;
}