수익아이템 안내 Mobile
특허있는 1등부업 드림큐 회원감사! 타부업 200,000원 대박이벤트!
[드림큐 생생후기] 내인생 최고의 전환점이 되어준 드림큐!   
알바 재택부업 글쓰기부업 포장부업 조립부업 전단지배포
수익확인 클릭수익 출석수익 소식받기 상담수익 리셀러수익 제휴사이트 실시간수익 오픈수익
드림큐 가입인사 10,000원 이벤트 진행중!
06월 20일 현재 업계최대 66,280개 드림큐후기 등록완료! 클릭한번에 최대 100,000원 즉시제공! 지금 바로 확인해 보세요!
No.1 재택/부업/창업 드림큐
 
ID 저장
 
아이디/비밀번호찾기
 
  홍보지원실
홍보공지
홍보마법사
왕초보 수익 만들기
대리홍보 서비스
홍보도우미
홍보TIP
Blog 스킨서비스
페이지광고
동영상광고
단축URL 생성서비스
무료자료실
태그교실
Blog 관리방법
카페 관리방법
색상표

  태그교실 홍보지원실 태그교실 

table tr td 표 만들기
등록일 : 2012-04-09 15:25:34    조회수 : 9198 글쓴이 : 스터디 담당자
안녕하세요. 홍보지원실 입니다.
 
html 태그 명령어 중에서 표를 만드는 <table> <tr> <td> 태그에 대해서 배워보도록 하겠습니다.
 
1. 기본 표 만들기
 
아래의 내용을 편집기 또는 메모장에 입력하신 후 저장해서 실행해 보세요.
 
===== 내용 입력 시작 =====
 
 <html>
  <head>
   <title><table> 표 만들기</title>
  </head>
  <body>
  <table border="2" width="200" height="200">
   <tr>
    <td><p align="center">표 만들기</p></td>
   </tr>
   </table>
  </body>
 </html>
 
===== 내용 입력 끝 =====
 
 

 

 
웹 문서에서 표를 만들고 싶을때는 <table> 태그와 <tr> 태그, <td> 태그를 사용하시면 됩니다.
 
<tr> 태그는 줄을 나타내고 <tr> 태그는 칸을 나타내는데,
 
<tr> 태그와 <td> 태그는 함께 사용하셔야 합니다.
 
2행 2열의 표를 만들어 보겠습니다.
 
아래의 내용을 편집기 또는 메모장에 입력하신 후 저장해서 실행해 보세요.
 
===== 내용 입력 시작 =====
 
 <html>
  <head>
   <title><table> 표 만들기</title>
  </head>
  <body>
  <table border="2" width="300" height="300">
   <tr>
    <td><p align="center">1, 1</p></td> <td><p align="center">1, 2</p></td>
   </tr>
   <tr>
    <td><p align="center">2, 1</p></td> <td><p align="center">2, 2</p></td>
   </tr>
  </table>
  </body>
 </html>
 
===== 내용 입력 끝 =====
 
 

 

 
<tr> 태그 <td> 태그의 구분을 하셔야 합니다.
 
2. 표를 만들면서 배경 화면에 이미지 넣기

표 만들기에서 배경 화면에 이미지를 넣어 보도록 하겠습니다.
 
아래의 내용을 편집기 또는 메모장에 입력하신 후 저장해서 실행해 보세요.
 
===== 내용 입력 시작 =====
 
 <html>
  <head>
   <title><table> 표 만들기</title>
  </head>
  <body>
   <table border="1" width="400" height="300">
    <tr>
     <td background="test.gif">
      <font color="red" size=5><p align="center"><b>표에 이미지 넣기</b></p></font>
     </td>
    </tr>
    <tr>
     <td>
      <p align="center">★ 대한민국 대표 No.1 재택/부업/창업 드림큐 ☆</p>
     </td>
    </tr>
   </table>
  </body>
 </html>
 
===== 내용 입력 끝 =====
 
 

 

 
<td> 안에 backgroud를 지정한 후 이미지를 넣으시면 됩니다.
 
사용법 : <td background="이미지 주소"></td>
 
<table> <tr> <td>에 들어가는 속성을 알아보도록 하겠습니다.
 
<table> : 표를 만들기 위한 기본 태그로서 <tr><td><th><caption> 태그 등과 같이 사용해서 표를 만들게 됩니다.
 
align : 표를 정렬 방법 지정 (left, center, right)
 
bgcolor : 표의 배경색 지정 (색상 이름 또는 색상값)
 
background : 표에 배경 이미지 넣기 (이미지 경로 지정)
 
border : 표의 테두리선 두께를 지정 (0 : 테두리 없음, 숫자 또는 픽셀 단위 입력)
 
bordercolor : 표 또는 칸의 테두리선 지정 (색상 이름 또는 색상값)
 
cellpadding : 셀의 안쪽 여백을 지정 (숫자 또는 픽셀 단위 입력)
 
cellspacing : 셀과 셀 사이의 여백을 지정 (숫자 또는 픽셀 단위 입력)
 
width/height : 표의 폭, 높이를 지정 (숫자 또는 픽셀 단위 입력)
 
frame : 표의 바깥 테두리선 지정
            above : 위쪽, below : 아래쪽, border 또는 box : 전체, lhs : 왼쪽,
            rhs : 아래쪽, hsides : 세로선, ysides : 가로선, void : 표시 안함
 
rules : 표의 안쪽 테두리선 지성
          all : 모두, cols : 칸 구분선, rows : 줄 구분선,
          group(thead, tbody, colgroup 등 안쪽 테두리), none : 표시 안함
 
 
<tr> 표에서 줄을 줄을 만듭니다.
 
width/height : 셀의 폭, 높이를 지정 (숫자 또는 픽셀 단위 입력)
 
align : 셀 내용의 정렬 방법 지정 (left, center, right)
 
bgcolor : 셀이나 줄 전체에 대해서 배경색을 지정 (색상 이름 또는 색상값)
 
valign : 셀 내용의 세로 정렬 방법 지정 (top : 맨 위, middle : 가운데, bottom : 맨 아래)
 
 
<td> : 표에서 칸을 만듭니다.
 
width/height : 셀의 폭, 높이를 지정 (숫자 또는 픽셀 단위 입력)
 
align : 셀 내용의 정렬 방법 지정 (left, center, right)
 
bgcolor : 셀이나 줄 전체에 대해서 배경색을 지정 (색상 이름 또는 색상값)
 
valign : 셀 내용의 세로 정렬 방법 지정 (top : 맨 위, middle : 가운데, bottom : 맨 아래)
 
background : 배경 이미지 넣기 (이미지 경로 지정)
 
nowrap : 줄 바꿈 되지 않게 지정
 
colspan : 여러 칸을 하나로 병합 (합치고 싶은 칸의 개수를 숫자로 입력)
 
rowspan : 여러 줄을 하나로 병합 (합치고 싶은 줄의 개수를 숫자로 입력)
 
<th> : 표의 한 칸을 만들며, <td> 태그와 속성은 같습니다.
             여기에 글을 입력하게 되면 제목으로 설정되어서 진하게 표시가 됩니다.
 
<caption> : 표의 제목이나 설명을 넣을때 사용하고, 표에서 가운데 위쪽에 표시가 됩니다.




미래창조과학부 eTrust 인증획득
서비스만족대상 부업 대상수상
초록우산 재단과 캠페인진행
ISO 9001 인증획득
ISO 14001 인증획득
드림큐소개 재택알바/부업 홍보지원실 정회원센터 커뮤니티 쉼터 기타 컨텐츠
드림큐소개/서비스안내
드림큐장점/수익안내
드림큐 생생후기
패러디/연혁/드림큐만화
드림큐 보도자료
인증 및 수상내역
드림큐 리셀러란?
신청방법/신청하기
일반부업 리스트
일반알바/당일지급
주말알바/주부알바
단기/편의점알바
파트타임/인재정보
홍보공지/대리홍보
홍보TIP/홍보도우미
홍보마법사/Blog 스킨
왕초보 수익 만들기
무료자료실/태그교실
Blog 관리/동영상광고
카페/색상표/페이지
정회원공지
입금공지
정책공지
수익금확인
1:1 문의하기
문의자접수
공지사항
가입인사
이벤트/간식
당첨자발표
제휴이벤트
수익금 리스트
유머/동영상
미니게임
일반만화/무협만화
오늘의운세
주간운세/월간운세
토정비결/평생사주
로또운세
재능마켓
창업정보
알짜정보
이야기
개인정보취급방침 입사지원 약관 제휴 광고 이용문의 과장광고 방지센터 이메일 무단수집 거부   
드림큐, dreamq, 드림홈에 대한 대한민국 특허청으로부터 상표신청이 완료 되었습니다. (상표번호 : 41-0248374-0000, 41-0257888-0000, 41-0259108-0000)
상표권 외 독창적인 영업방식 및 서버와 클라이언트의 DB 연결방식등 다양한 비즈니스 모델을 특허 출원중 이므로 드림큐 비즈니스 방식의 모방을 금지합니다.
업체명 : (주)드림컴퍼니 사업자등록번호 : 127-86-53048 통신판매업신고번호 : 경기의정부-0020호 대표 : 이승진
주소 : 경기도 의정부시 호원동 351-6 호원빌딩 4층 직업정보제공사업 신고번호 : 의정부 제2014-2호   
드림큐 고객센터 : 1600-9280  (업무시간 : [평일]10:00 ~ 19:00, [토요일]10:00 ~ 15:00, 공휴일 휴무)
Copyright 2012 ~ 2018 DreamQ Corp. All Rights Reserved.