Table frame속성

HTML 2012. 1. 3. 21:12



  안녕하세요?

  오늘은 테이블에 프레임속성을 주는 그런 소스가 되겠습니다. 테이블 속성으로는 경계를 정하는  border 속성이 있을수 있겠고 또 정렬을 주는 align도 있겠습니다. 오늘은 그 중에 frame속성입니다. 이것은 예를들어 <table frame="above">를 주면 그 테이블은 셀위에만 줄이 그어진 형태가 되는 것입니다. 자세한 것은 예제를 보시면 이해가 빠르실겁니다.

 

<html>
<body>

<p>
<b>Note:</b>
If you see no frames/borders around the tables below, your browser does not support
the "frame" attribute.
</p>

<h4>With frame="border":</h4>
<table frame="border"> <!-- 경계가 있습니다. box형이랑 비슷합니다. -->
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>With frame="box":</h4>
<table frame="box">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>With frame="void":</h4> <!-- 선이 아무것도 나타나지 않습니다. -->
<table frame="void">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>With frame="above":</h4> 
<table frame="above"> <!-- 셀위에만 선이 그어집니다. -->
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>With frame="below":</h4>
<table frame="below"> <!-- 셀 아래에만 선이 그어집니다. -->
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>With frame="hsides":</h4>
<table frame="hsides"> <!-- 가로줄만 그어집니다. -->
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>With frame="vsides":</h4>
<table frame="vsides"> <!-- 세로줄만 그어집니다. -->
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>With frame="lhs":</h4> <!-- 왼쪽선만 그어집니다.
<table frame="lhs">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>With frame="rhs":</h4> <!-- 오른쪽 선만 그어집니다. -->
<table frame="rhs">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>  
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

</body>
</html>

 

  테이블은 잘 아시리라 생각하고 frame속성에 따라서 테이블이 다르게 그려집니다. 주석을 참고하시고 결과를 보시면 더 잘 이해하시겠지요?

 

Note: If you see no frames/borders around the tables below, your browser does not support the "frame" attribute.

With frame="border":

First Row
Second Row

With frame="box":

First Row
Second Row

With frame="void":

First Row
Second Row

With frame="above":

First Row
Second Row

With frame="below":

First Row
Second Row

With frame="hsides":

First Row
Second Row

With frame="vsides":

First Row
Second Row

With frame="lhs":

First Row
Second Row

With frame="rhs":

First Row
Second Row

 

  이해하시겠지요? 그럼 다음시간에 또 만나요~

 

'HTML' 카테고리의 다른 글

HTML CSS JQUERY JAVASCRIPT 괜찮은 사이트 발견!!  (0) 2015.04.16
이미지맵  (0) 2011.12.29
html style background-color  (0) 2011.12.25
HTML style-1  (0) 2011.12.22
인용문 <blockquote> <q>  (0) 2011.12.18


설정

트랙백

댓글