>  기사  >  웹 프론트엔드  >  HTML 테이블의 프레임 및 규칙 속성에 대한 자세한 설명

HTML 테이블의 프레임 및 규칙 속성에 대한 자세한 설명

高洛峰
高洛峰원래의
2017-02-17 16:02:113125검색

웹 페이지에서는 프레임과 규칙을 사용하여 테이블 테두리 표시 여부를 제어할 수 있습니다. 아래에서는 HTML에서 테이블 테이블의 프레임과 규칙 속성을 자세히 설명합니다. 🎜>

table 태그는 프레임 및 규칙 속성으로 테두리 표시를 제어할 수 있습니다. 프레임 속성은 테이블의 가장 바깥쪽 테두리 4개의 가시성을 제어하는 ​​반면, 규칙은 테이블 내부 테두리의 가시성을 제어합니다.

frame 속성의 가능한 값과 의미는 다음과 같습니다.
* void - 기본값. 테이블의 가장 바깥쪽 테두리가 표시되지 않음을 나타냅니다.
* 상자 - 4개의 테두리를 동시에 표시합니다.
* 테두리 - 4개의 테두리를 동시에 표시합니다.
* 위 - 위쪽 테두리만 표시됩니다.
* 아래 - 하단 테두리만 표시됩니다.
* lhs - 왼쪽 테두리만 표시합니다.
* rhs - 오른쪽 테두리만 표시합니다.
* hsides - 두 개의 가로 테두리만 표시합니다.
* vsides - 두 개의 수직 테두리만 표시합니다.
rules 속성에는 5가지 가능한 값이 있습니다.
* 없음 - 기본값입니다. 국경이 없습니다.
* 그룹 - 행 또는 열 그룹에 테두리를 추가합니다.
* 행 - 행에 테두리를 추가합니다.
* cols - 열에 테두리를 추가합니다.
* all - 모든 행과 열(셀)에 테두리 추가

코드 예:

<table border="1" width="600" frame="hsides" rules="groups">  
     <caption>My Ultimate Table</caption>  
     <colgroup span="1" width="200"></colgroup>  
     <colgroup span="3" width="400"></colgroup>  
  
<thead>  
     <tr>  
          <td>cell 1-1</td>  
          <td>cell 1-2</td>  
          <td>cell 1-3</td>  
          <td>cell 1-4</td>  
     </tr>  
</thead>  
<tfoot>  
     <tr>  
          <td>cell 4-1</td>  
          <td>cell 4-2</td>  
          <td>cell 4-3</td>  
          <td>cell 4-4</td>  
     </tr>  
</tfoot>  
<tbody>  
     <tr>  
          <td>cell 2-1</td>  
          <td>cell 2-2</td>  
          <td>cell 2-3</td>  
          <td>cell 2-4</td>  
     </tr>  
     <tr>  
          <td>cell 3-1</td>  
          <td>cell 3-2</td>  
          <td>cell 3-3</td>  
          <td>cell 3-4</td>  
     </tr>  
</tbody>  
</table>

브라우저에서 표시 효과는 다음과 같습니다. :


HTML 테이블의 프레임 및 규칙 속성에 대한 자세한 설명

HTML 테이블의 프레임 및 규칙 속성에 대한 자세한 내용은 PHP 중국어 웹사이트를 참고하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.