Today : 2025년 01월 12일 (일요일) 로그인      회원가입
[]     본 홈페이지는 2024년12월31일 중단합니다               ⑦ 배경 테그               ⑥ 음악 테그               ⑤ 테이블 테그               ③ 글씨 테그               ★컴퓨터 고장 이럴땐 이렇게               소화불량에 걸린 내 컴퓨터‘쌩쌩’하게 만들기               스케너. 디카 사진 사용법/ 게시판 중앙에 넣기               배경음악넣기               장미란의 감사 기도!!!/ '크리스챤 유승민 16년만에 중국 격파 /설교자가 오해하는 마태복음 15장              

  홈     A  



⑤ 테이블 테그
2005-02-25 15:50:13   read : 65536

 

 



테이블 태그.<table>
태이블 태그는 표를 만드는 태그를 말합니다.
표(table)의 기본구조

<table>
<coption>...</coption>
<tr>
<th>...</th>
<td>...</td>
</tr>
</table>


 <table>

 표 작성함을 정의한다 (</table>은 표가 끝남을 정의)

 <tr>

 Table Row의 약자로, 표 안에서 한줄(Row)이 끝났으
 므로 줄바꾸기를 한다.

 <th>

 Table Heading의 약자로, 표의 머리글 (Header) 임을
 나타낸다.

 <td>

 Table Data의 약자로,보통체와 왼쪽정렬로 적용된다.

 <caption>

 표의 주석문(제목)을 표화 함께 나타내는 속성이다.
 align=top -->표의상단
 align=bottom -->표의하단

표에서 사용되는 속성

속성

정의

 width=50%

 표나 셀의 폭(넓이)을 창의 백문율(%)로 지정한다.

 width=400

 표나 셀의 폭을 픽셀 값으로 지정한다.

 height=pixel수

 셀의 높이(세로)를 지정한다.

 cellpadding=10

 셀의 안쪽 여백(셀의 테두리와 문자열 사이의 간격)을 10픽셀로 지한정다.

 cellspacing=5

 셀과 셀 사이의 간격을 5픽셀로 지정한다.

 border=숫자

 표 테두리의 두께를 지정하는 것으로 숫자가 커질수록 두꺼워진다.
 border=0 이면 웹 브라우저에서 표의 테두리가 보이지 않는다.

 colspan=2

 가로의 열(column) 2개를 합치기 한다.

 rowspan=3

 세로의 줄(row)3개를 합치기 한다.

 valign="위치"

 align="left,right,center" -셀 안에서의 가로 위치 정렬

 align="위치"

 valign="top,middle,bottom" - 셀 안에서의 세로위치정렬

 bgcolor="색상"

 표 전체 또는 선택된 셀의 배경 색상을 지정한다.

 backround="주소"

 표 전체 또는 선택된 셀의 배경 이미지를 삽입한다.


예제 1)
----------------------------------------------------------------

<table border="1">
<tr>
  <td bgcolor="yellow"> 포토샵 </td>
  <td> 플래시 </td>
</tr>
<tr>
  <td> 나모웹 </td>
  <td> 드림위버 </td>
</tr>
</table>

 
포토샵 플래시
나모웹 드림위버

예제 2)
----------------------------------------------------------------

<table border="1" bordercolor="red" cellspacing="0">
<tr>
  <td> 포토샵 </td>
  <td> 플래시 </td>
</tr>
<tr>
  <td> 나모웹 </td>
  <td> 드림위버 </td>
</tr>
</table>

포토샵 플래시
나모웹 드림위버

예제 3)
----------------------------------------------------------------

<table border="0">
<tr>
  <td> 포토샵 </td>
  <td> 플래시 </td>
</tr>
<tr>
  <td> 나모웹 </td>
  <td> 드림위버 </td>
</tr>
</table>

포토샵 플래시
나모웹 드림위버

예제 4)
----------------------------------------------------------------

<table background="img/tablebg.jpg" border="1">
<tr>
    <td> <font color="red">포토샵</font>     </td>
    <td> <font color="red">플래시</font>     </td>
</tr>
<tr>
    <td> <font color="red"> 나모웹</font>     </td>
    <td> <font color="red">드림위버</font>     </td>
</tr>
</table>

포토샵 플래시
나모웹 드림위버

예제 5)
----------------------------------------------------------------

<table border="1">
  <td rowspan="4"> 웹제작 </td>
     <td>나모웹 에디터</td>
     <tr>
     <td>드림위버</td>
     <tr>
     <td>포토샵</td>
     <tr>
     <td>플래시</td>
</table>

웹제작 나모웹 에디터
드림위버
포토샵
플래시







 




Copyright © Lord Pier. All Rights Reserved.



독자 한마디
sROxGJCtfFIHkNgb
MKCeiDORbGqHBj sheila_tufty7062@yahoo.com
AjFKSZop
vehtkMRPourYWcw afrikahlindseyn42@gmail.com
SHslULOukG
eCyFUVLJ wdjessag336@gmail.com
xyhEAPrdWf
cbuOCHTJzEeAk maciamahalagg5346@gmail.com
RiNIuvKeGMFTBoQ
IydtCEjR thorntonroyalfj220@gmail.com

의견쓰기
이 름 E-mail
제 목



프린트하기 기사메일보내기 독자한마디


이전으로
⑦ 배경 테그
⑥ 음악 테그
⑤ 테이블 테그
③ 글씨 테그
 | Home | 사이트구조 | 내용검색 | 전체내용보기 | 내용올리기 |개인정보취급방침 |  | 
  Contact Webmaster