Computer >> 컴퓨터 >  >> 프로그램 작성 >> HTML

HTML에서 테이블 열을 병합하는 방법은 무엇입니까?


HTML의 테이블 열을 병합하려면 태그의 colspan 속성을 사용하십시오. 이를 통해 셀을 서로 병합합니다. 예를 들어, 테이블에 4개의 행과 4개의 열이 있는 경우 colspan 속성을 사용하면 테이블 셀의 2개 또는 3개를 쉽게 병합할 수 있습니다.

HTML에서 테이블 열을 병합하는 방법은 무엇입니까?

예시

다음 코드를 실행하여 HTML의 테이블 열을 병합할 수 있습니다. 먼저 HTML로 3행 3열로 테이블을 만드는 방법을 살펴보겠습니다.

<!DOCTYPE html>
<html>
   <head>
      <style>
         table, th, td {
            border: 1px solid black;
            width: 100px;
            height: 50px;
         }
      </style>
   </head>

   <body>
      <h1>Heading</h1>
      <table>
         <tr>
            <th></th>
            <th></th>
            <th></th>
         </tr>
         <tr>
            <td></td>
            <td></td>
            <td></td>
         </tr>
         <tr>
            <td></td>
            <td></td>
            <td></td>
         </tr>
      </table>
   </body>
</html>

출력

HTML에서 테이블 열을 병합하는 방법은 무엇입니까?

예시

colspan 속성을 사용하여 열을 병합해 보겠습니다. 처음 2개의 열이 병합됩니다.

<!DOCTYPE html>
<html>
   <head>
      <style>
         table, th, td {
            border: 1px solid black;
            width: 100px;
            height: 50px;
         }
      </style>
   </head>
   <body>
      <h1>Heading</h1>
      <table>
         <tr>
            <th></th>
            <th></th>
            <th></th>
         </tr>
         <tr>
            <td colspan="2"></td>
            <td></td>
         </tr>
         <tr>
            <td></td>
            <td></td>
            <td></td>
         </tr>
      </table>
   </body>
</html>

출력

HTML에서 테이블 열을 병합하는 방법은 무엇입니까?