요약정리

운영자 | 기사입력 2006/08/26 [08:27]
>
필자의 다른기사 보기 인쇄하기 메일로 보내기 글자 크게 글자 작게
요약정리
 
운영자   기사입력  2006/08/26 [08:27]

     - 정보를 가공해서 올리는 사이트 : 고 부가가치 사업
     - windows 와 리눅스의 차이
     - 사용자의 입장
     - 관리자 모드
     - PHP : 프로그래밍과정 (미리준비)
     - 자기전문성
     - 쇼핑몰 : 디자인 - 20~30%, 프로그램 - 70% 정도
     - 리눅스의 대표적 장점 : 원격제어에 강함.
     - ip address : 127.0.0.1 ( 자신의 컴퓨터를 지칭하는 ip)
                          210.127.244.174  (공인 ip - 인터넷 가, 대부분의 ip가 공인ip임)
                 192.168.0.1 ~ 255 ( 비공인 ip - 실제적으로 인터넷 불가 , 내부적으로만  사용될 ip에 적용, 게이트웨이                                     를 통한 가상의 ip가 지원되서 인터넷이 가능하게 된다. 리눅스 설치할 때 사용하면 됨)
     - 서브넷 마스크 (subnet mask) : 255.255.255.0 (대부분의 pc에서 사용함), 많은 컴퓨터가 있는데에서 그룹을 알려주기
                                                         위함. (동일그룹끼리만 통신이 가능), 등급에 따라 약간씩 다름. 국내는 거의 비슷.
     -  GateWay : 외부의 컴퓨터로 연결하는 역할.
     -  DNS server : 211.108.79.4 (도메인으로 ip를 찾아주는 역할을 해주는 서버의 주소)
     - ping 자신의 ip : ip가 살아있는지 확인하는 명령(reply 명령이 뜨면 ip가 제대로 작동중임을 의미)
 
* ip를 확인하는 방법 :
          - win98 : winipcfg
          - windows 2000 : cmd  ->   ipconfig /all
          - window XP : ipconfig
* 리눅스가 개인pc시장에 진출하지 못하는 대표적인 이유 : 브라우저(explorer) 때문.
* PHP : web 프로그램. (브라우저와 메모장을 이용해서 프로그램 작성)
* anonymous FTP : 공개 FTP 호스트( 파일 배포를 목적으로 사용됨)
* telnet 실행 : 시작 - 실행 - 'telnet' 입력 , 종료 : quit
* c:\>nslookup  :   도메인명을 통해서 아이피로 변환하거나 아이피를 통해서 도메인명으로 변환하고자 할때 사용.
                              명령프롬프트에서 nslookup 도메인명 또는 nslookup ip어드레스 입력
* 리눅스와 유닉스의 차이
     - 리눅스 : 유닉스의 기능을 그대로 만듬. 내부적인 구조는 다르나 기능은 거의 동일.
                     유닉스는 대형서버용, 리눅스는 pc에서도 서버구축이 가능한 os
 * 레드핫 리눅스 : 국내 80%이상 점유.
 * html과 php
        - php,asp, jsp : 프로그램이 들어간 홈페이지
        - html : tag가 들어간 홈페이지
 *
 
=======================================================================
- Javascript : Nescape사와 SUN Microsystems 사에서 공동제작
- VBScript : 뒤이어 MS사에서 제작
- JScript : ms 사에서 제작
- javascript 사용시 주의사항.
             1. 대소문자 구분를 구분해서 입력할 것.
             2. 문법에 맞춰 작성하는 것이 중요
             2. function은 '('로 시작, ')' 로 끝
             3. 주석 : '//'   또는 '/*  ~~~   */'
 
예) 자주사용하는 중요한 소스이미로 잘 보관(교재 144의 내용)
 
<HEAD>
<TITLE> 매일 가는 곳 </TITLE>
<script language="javascript">
<!--
             function jump()
             {
                           location=document.myMenu.favorites.options                                    [document.myMenu.favorites.selectedIndex].value
             }
             //-->
</script>
 
</HEAD>
 
<BODY>
<center>
<h3>매일 가는 곳</h3>
<form name="myMenu">
             <p>
             <select name="favorites" size="1" onChange="jump()">
                           <option selected> ###즐겨찾기 ### </option>
                           <option value ="http://dottohome.com">dottohome</option>
                           <option value="http://www.liworld.co.kr/"> 신기한 리스닝 나라 - 영어공부</option>
                           <option value="http://ghoststation.co.kr/">Ghost station -방송듣기</option>
                           <option value="http://www.kcug.net">셀빅 사용자 그룹- 셀빅정보</option>
                           <option value="http://www.maxmp3.co.kr">maxMP3 - 음악 듣기</option>
             </select>
</form>
</center>
 
</BODY>
</HTML>
 
 
 
1. head 태그안에 기술할 것.
2. editPlus의 'script'단추 클릭 : <SCRIPT LANGUAGE="JavaScript">
             <!--
                인식못하는 브라우저 상에서는 주석처리하라는 의미에서 스크립트 언어를 주석안에 기술.
            
             //-->
             </SCRIPT>
3. function 으로 사용 : 만들어 두고 필요할 때마다 불러와서 사용.
    - { 로 시작, } 로 끝냄.
4. 자바스크립트에서 사용하는 개체명은 소문자를 정확히 기술.
  : 개체 = 객체 = object ( 모두 같은의미)
5. Method(메서드) : 함수로 이미 만들어져 있는 함수.
     - 인수의 유무와 갯수, 순서(형식)을 잘 따져볼 것.
6. 불러다 사용하는 것은 BODY
7. 따옴표를 두개 써야 할경우 : 안의 따옴표는 작은따옴표 사용.
8. 이벤트가 언제 수행될지 시점이 중요.(body안에 기술)
   -  event : onload, onClick, onunload, onfocus 등
 
 <BODY onload="openWin('html001.html')" onunload = "alert('잘가쇼~~')" >
 
* 자바스크립트 작성 3가지
    1. head 안에
    2. body 의 태그안에 javascript: 명령으로 직접 기술
    3. 파일로 작성 (*.js)
 
===================================================================
 
* 자바스크립트 기초 : 이것만은 꼭 알고 갑시다.
 
1. 선언방법
  1) 내부 스크립트 : html문서안에 필요한 자바스크립트 소스를 기입.
    - 형식 : <SCRIPT LANGUAGE="Javascript">
                  <!--
                           [자바스크립트 소스]
 
                  // -->
                </SCRIPT>
             @ 주석안에 소스를 기입하는 방법 : 자바스크립트를 지원하지 않는 브라우저를 위해.
 
   2) 외부 스크립트 : 별도의 파일로 저장 (*.js)
      - <SCRIPT>태그를 사용해서 외부스크립트 파일을 html문서로 가져오는 방법
      - 형식 : <SCRIPT LANGUAGE="Javascript" SRC="스크립트 파일"></SCRIPT>
      - 외부스크립트의 장점
             @ 소스를 감출 수 있다.
             @유지,관리가 쉽다.
             @ 라이브러리를 지원함.
 
2. 자바스크립트의 핵심.
   1) 함수: 어떤동작이나 기능을 실행하기 위해 여러가지 명령을 모아놓은 것.
             - 형식 : function 함수 이름([매개변수])  {
                           [명령들]
                           }
 
   2) 변수 : 값을 전달하기 위해 저장해 두고 사용하기 위한 공간.
             - 형식 : var 변수명 = 선언내용.
                           (var : 지역변수 선언시 사용되는 keyword)
 
   3) 객체 방식 프로그래밍(OOP) → 교재 389p 객체의 계층구조 참조할 것.
             @객체(object) : 눈에 보이는 모든 대상
                           ex) window, status bar, menu bar, scroll bar, tool bar 등
             @ 프로퍼티(property) : 상태 즉 객체의 값을 변경하는 것.(속성)
                           ex) window.toolbar , window.scrolls, 등
             @ 메서드(method) : 객체의 동작 방법
                           ex) open(), close(), alter() 등
             @ 이벤트 핸들러(event hander) : 어떤 행동을 했을 때 그에 다른 반응을 보이도록
                                                                  하는것 ('on~'으로 시작) . 어떤 동작이나 사건.
                           ex) onClick,
 
                         ※ 사용 방법 : object.property = value
                                         object.method(인수)  -->인수는 없을 수도 있다.
 
3. 코딩을 위한 기본 약속 : Syntex
    1) 따옴표 사용하기
             : 따옴표안에 또 따옴표 사용할 경우 작은 따옴표 사용할 것.
    2) 세미콜론(;) 사용
             : 한줄에 2개이상의 문장을 기술시 ';'으로 구분.
    3) 자바스크립트는 대소문자 구별한다.
    4)  주석
             - 한줄 주석 : '//' 기호 다음부터 한줄만 주석으로 인식. (한줄 넘으면 오류)
             - 여러줄 주석 : '/*' 시작, '*/'로 마무리.
 
4. 스크립트  실행하기
   1) 스크립트 소스에서 직접 실행 : 실행할 소스가 짧을 경우
             :<SCRIPT> 와 </SCRIPT> 사이에 즉시 실행할 수 있는 문장 기입
             @ <HEAD>와 </HEAD> 사이에 소스 삽입하면 <BODY> 태그가 실행되기 전에 스크
                   립트가 먼저 실행됨.
             @ <BODY> 태그 바로 다음에 소스 삽입하면 <BODY>안의 속성이 적용된 후에 스크
                  립트가 실행.
             @</BODY> 태그 바로 위에 소스 삽입하면 소스 이전의 HTML 태그를 모드 처리한후
                  스크립트가 실행.
   2) 링크 이용하기 : <A> 태그의 href 속성에 'javascript:스크립트 소스 형식' 으로 사용.
             @ 형식 : <A HREF="javascript:실행내용"> ~ </A>
 
   2) 외부파일이용(*.JS)
   3) 링크 이용
 
5. 자바스크립트 익히는 순서
    1) 문법(syntex)
    2) 변수
    3) 제어문(if, loop ) 과 반복문(for, while)
    4) 함수
 
 
 
1. 서버의 종류 확인할 것
     : 리눅스, 유닉스, 윈도우
     - 컴내꺼 : 유닉스 서버를 사용.(파일이름의 대소문자를 구분할 것.)
 
2. 첫페이지 파일이름 : 'index.html'로 지정하면 url뒤에 파일명 안써도 첫화면으로 인식함.
                               - (리눅스나 유닉스에서)
   ※ 윈도우는 : default.html을 첫페이지로 인식.
 
3. ftp 홈페이지 올리기
             - 로그인
             - 홈계정 클릭
             - 모드 바꾸기 : 전문가 모드로
             - 파일업로드 : ftp 포트개방 신청 - 내장 ftp 실행 - 접속하기 : 아이디와 비밀번호
             - 폴더와 파일의 위치를 잘 고려해서 문서를 업로드 시킬것.
             - 브라우저에서 : '자신의id.com.ne.kr'입력하면 드뎌 홈피 완성.
=============================================================
 
* 설치전 알아야 할 정보
             1. 랜카드 정보와 ip, netmask, gateway, dns 정보
             2. vga 카드 정보
             3. 기타사운드 카드, 기타 장비
 
* 리눅스 파티션
             : 설치시 필요한 기본 파티션 2개 이상 필요
 
               - 네이티브 파티션 : 프로그램이 설치 ( / 파티션 )
            
 
              - 스왑(swap) 파티션 : 하드디스크를 메모리 공간으로 사용하기 위함
                             (보통 메모리 용량의 2배정도, 메모리가 부족할 때 사용되는 파티션)
 
* 파일 포맷 : 각 os별로 포맷 형식이 다름. (파일을 저장하기 위한 형식)
             - 윈도우 : fat16, fat 32, ntfs
             - 리눅스 : ext3
 
* 부팅 : grub 화면으로 멀티 부팅
             - GUI 방식 : X 윈도우로 부팅
             - Text 방식 : id와 password 입력창만 나옴.(주로 사용)
             - x윈도우에서 text 모드로 이동 : hanterm
 
* home 디렉토리 : cd ~
             [root@sansung root]#   --> 관리자모드
                           sansung : 호스트명으로 주로 자신의 도메인명으로 사용.
 
* user를 만들어서 작업 ( 가상 콘솔을 만들어서 작업할 때 사용.)
 
* 시스템 끄기 : shutdown (원격지에서 명령을 줄 수 있다)
 
* 'man 명령어'  --> 해당명령어에 대한 옵션을 보여줌. (p152 ~ )
 
* 리눅스 기본 명령어 (p153 ~ )
   1. ls
   2. cp
   3. rm
   4. cd
   5. mkdir
   6. rmdir
   7. mv
   8. df  :  'df  -h'  --> 남은용량 확인
   9. du :
  10. cat : 파일의 내용을 보여줌  <형식> 'cat 파일명'
  11. tail : <형식> 'tail 파일명'
            - 파일의 끝만 보여줌. (파일을 다 열지 않으므로 큰용량의 파일에서 끝부분만
                                                                   지정한 만큼 보여줌.)
         ex) tail  -20 파일명 --> 끝부분의 20줄만 보여줌.
  12. ps (프로세스 상태 확인. cpu가 현재 하고있는 일을 볼 수 있다.)
        ex)  ps  -aux | more  (cpu가 하는일을 화면단위로 보여줌.)
 
13. mount :
             - 물리적인 장치(HDD, CDROM, FDD등)를 파일시스템으로 변경
             - 개념적으로 알고 있어야 함.
             - dos에서 사용한 파일을 마운트시켜 리눅스로 불러올 수 있다.
 
14. mkfs : dos의 format 명령과 동일.
           - 설치시, 리눅스 내부적으로 작동함.
15. kill : 프로세스 죽이기 ( ps로 프로세스 확인, kill로 프로세스 죽이기)
             - 프로세스가 잘 죽지 않을 때 : '-9' 옵션 이용해서 강제로 죽임.
 
* p 178 ~ : tar.gz(타볼 소스) 압축풀기
 
* RPM 풀기 : 'Redhot Package Management'의 약자.
 
* 리눅스에 프로그램 설치
             - RPM 방식 : ftp 서버 구동시 rpm 방식 이용(red hot에서 처음 사용됨)
             - 소스를 이용한 방식 : compile 과정을 거쳐 기계어 코드화 함.
 
* 설치 후 작업
   1. 리눅스 시작( x윈도우 -빨간모자) - 시스템도구 - 터미널
             - # cd  /etc
             - # pico inittab : 피코로 inittab 파일 열기
                   $ 첫화면의 ' id: 5' 를 'id:3' 으로 바꾼다.
                   $ 'ctrl + s' 로 저장 후 재부팅
             -# shutdown -r now : 재부팅
             -# shutdown -h now : 시스템을 완전히 종료.
   2. 본인 ip 확인
             - x윈도우의 프로그램 실행에서 : 'hanterm'  (gui모드에서 text 모드로 전환)
             # ifconfig
                           - eth0 와 lo : 인터넷 사용 가능
             # ping 외부의 도메인 입력 : reply가 뜨면 인터넷이 된다는 의미
                ex) 'ping iwav.co.kr'
             # netconfig : 인터넷이 되지 않을 경우 ip와 넷마스크등 다시 입력할 것
             # 'ftp 도메인명'  : ftp 접속이 됨
             # 'telnet 도메인명' : 텔넛 접속
            # x윈도우로 이동  -> 'startx'
             # mozilla : 모질라 브라우저 이용
 
※ 파티션의 의미
             - boot : 부트관련 자료
             - etc : 설정 파일들이 주로 저장
            - home : user들을 위한 공간 (관리자 : root(/)부터 시작)
             - mnt : mount 되는 장비들
             - root : 관리자용 id 홈 디렉토리
             - tmp : temperary 파일들
             - var : 기록이 들어가는 디렉토리(user 들의 login 기록들이 저장)
 =========================================================================
배경음악 넣는 여러 가지 방법
 
1. 기본 소스  : '><embed src="음악 주소"></embed><''
 
크기 조절 및 재생 실행 횟수 설정 :
 
'><embed src="음악 주소" width="가로크기" height="세로크기" loop="-1"></embed><''
 
※ loop="-1" 을 삽입한 것은 무한 재생을 의미합니다.
 
※ <멀티미디어가 있는 위치><''' > - 위 소스를 사용하고 나면 왼쪽에서처럼 자욱들이 남게 되는데요. 마우스 커서를 지울 부분 옆으로 위치한 다음, 키보드의 ← 를 이용해서 자욱을 지워주시면 되겠습니다. 또는, 지울 부분을 블록 잡은다음, 키보드의 Delete를 누르면 되겠습니다..
 
(단, 멀티미디어가(밑줄친부분) 있는 위치는 지우시면 안되겠지요?^^)
 
 
 
파일 이름, 만든이 등을 표시하려면, showstatusbar="1" 를..(출처 표시는 기본 예의겠죠.)
 
소리 크기를 항상 최대로 설정하고자 한다면, volume="0" 를.. 추가합니다.
 
 
뮤직 비디오 포스트를 작성할때에 멀티미디어에 있는 재생,, 버튼들을 안보이게 하려면, showcontrols="0" 를 추가합니다.
 
2. 가장 기본형태 [한번만 연주합니다]
 
<embed src="음악 주소"></embed>
 
3. 사운드/동영상 자동 실행하기
 
홈페이지 삽입용 소스 : <embed src="음악 주소" autostart="true"></embed>
 
4. 사운드/동영상 계속 실행하기 : loop=-1 을 넣어도 되구요. 또는 loop="Infinite"만 넣으셔두 되구요..
 
<EMBED src="음악 주소" loop="-1"></EMBED>
 
 
5. 플레이어 숨기기 : <EMBED src="음악 주소" hidden="true"></EMBED>
 
 
6. 사운드/동영상 프로그램 사이트 연결하기
 
<EMBED src="음악 주소" pluginspage="문서 주소"></EMBED>
 
 
7. 동영상 보는 기본 소스
 
<EMBED src="동영상 주소" width="가로크기숫자" height="세로크기숫자" boder="0"></embed>
 
 
8. 동영상이나 사운드 화면크기 조절하기
 
<EMBED src="파일 경로 주소" width="가로크기" height="세로크기"></EMBED>
 
9. 링크로 사운드/동영상 연결하기 <A href="파일 주소">제목</A>
 
10. 플레이어 안보이게 하는 소스
 
<bgsound src="여기에 음악 주소를 넣으세요" loop="infinite">
================================================================
* Markup Language : '<>'로 마킹해서 사용해서 결과물을 얻게해주는 언어.
             - HTML, CSS
             - XML  : HTML이 확장된 언어
* 구성
             <HTML>
             <HEAD>
             <TITLE>   문서의 제목 </TITLE>     ---> 반드시 기입
              문서의 정보
             </HEAD>
             <BODY>
              문서의 주 내용
             </BODY>
             </HTML>
 
* <body> 태그의 속생
             - background : 배경이미지
             - bgcolor   색상  : 색상명 또는 16진수값
                                          - RGB 원리 (#000000 ~ #FFFFFF )
             - text
 
* 경로지정
             - 절대경로 : 루트 디렉토리를 기준으로 경로를 순서대로 다 지정해 주는것
                           (사이트 주소를 지정할 때)
             - 상대경로 : 현재 자신의 위치를 기준으로 지정.(일반적으로 많이 사용.)
                           (문서의 위치를 지정할 때)
 
* <p> : 단락은 구분해주는 것이 유리.  align 으로 정렬을 지정해 줄 때는 반드시 </p>로 닫기
             (줄바꿈 태그로 사용하는 것은 금지할 것.)
 
==============================================================
* <head> 태그는 자동줄바꿈이 된다.
 
* URL( Uniform Resource Location ) : 인터넷에 연결된 어떤 정보에 접근하기 위해 사용하는
                           주소형식을 가리키는 말.
* 주석처리 : <!-->  comment  : 초록으로 표시되는 부분에 대해서 전부 주석처리  <-->
 
* <font> : 줄바꿈이 안되므로 끝에 <br>을 추가할 것.
             - 속성(attribute)
                           1. face = "글꼴( 돋음, 궁서, 굴림 등)"
                                --> 사용자 컴퓨터에 해당글꼴이 설치되어 있지 않으면 안됨.
                                --> 글꼴을 그림으로 만들어서 사용함.
                           2. size = 숫자 --> 숫자가 클수록 글자도 커짐(1-7까지, 글꼴 기본은 3.)
                                        ( 문안한 글꼴 :11포인트 - 포인트로 글꼴을 지정하려면 CSS로 사용)
                           3. <basefont size = 5>
                           - font size를 상대값으로 줄 수 있다. (형식 : size =-1, size = -2 )
                           - basefont 를 기준으로 한단계위(+1), 한단계 아래(-1)로 조절됨
                           4. color = "#009900" : 해당 font의 색지정. 일부분만 변경.
                             --> 문서전체의 텍스트색상을 바꿀때는 <body text="색상"> 사용.
 
* <marquee> : 지시한 방향으로 글자나 이미지가 움직이게 하는 효과.
             1. width = 값 ( % 단위 : 해상도 설정값에 따라 자동 조절,
                                    pixel 단위 : 해상도에 맞추어 크기가  고정됨)
             2. behavior ="alternate" : 좌우로 왔다갔다 하는 효과
             3. direction ="up" height =" 200" : 상하로 왔다갔다하는 효과
             4. scrolldelay ="500" : 움직이는 속도를 느려지게함.(1/1000초 단위)
                                        ( 숫자값이 클수록 느려짐.)
             5. scrollamount ="1" : 한번에 스크롤되는 픽셀 수. 숫자가 커질수록 속도가 빨라짐.
             ★ <marquee> <img src= "images/icon1.bmp"> </marquee>
                           : 그림을 움직이게 함.
 
================================================================
*  특수기호 사용법
             - &nbsp; (공백) ,  &gt; ( 기호 '>')  ,  &lt; (기호 '<')
* 절대경로지정
             - ./ : 하위경로가 복잡할때 무조건 루트에서 시작.
 
* 이미지 삽입
   : 이미지의 위치 조절
             - 그림아래 부터 내용이 나오게하려면 :<br>
             - 그림을 정렬 : align ="left" 속성 추가
             - Tooltip : 'alt="풍선도움말 내용" '
             - ' border= 숫자' : 그림 주변에 수치만큼 테두리가 생김.
                            (홈페이지에서는 border를 없애는 용도로 사용함.)
             - ' width = 70% ' ,  ' height = 70% ' : 그림의 크기를 조절. ( 미세한 조절에만 사용.)
              (단위 : % - 해상도에 따라 크기 자동조절, 픽셀 - 해상도에 상관없이 크기 고정)
             -' hspace="10" vspace ="10" ' : 그림과 글자사이에 수직수평으로 여백 주기.
 
* 하이퍼링크 만들기 (교재 68p ~ )
             ※ Protocol : 통신규약(TCP/IP)
              - web : 'http://'
              - mail  : 'mailto:'
              - ftp : 'ftp://'  ex) ftp://ftp.microsoft.com (anonymous 계정)
              - usenet : ' news: '
 
      형식 :  <a href ="http://www.newsstand.co.kr " target="_blank">  가판대</a><br>
                           : 가판대 사이트를 새로운 창(_blank)에 띄움
                             - target : 어디에 열까요. ( _blank, _self (현재창에) )
   1. <a href ="html001.html"> 다른 문서 열기 </a><br> : 같은위치안에 존재하는 파일.
                (상대경로지정, 뒤로 앞으로 단추에 적용함)
 
   2. <a href ="http://www.newspaper.co.kr"> 웹 사이트 열기</a><br>
   3. <a href="ftp://ftp.microsoft.com"> FTP 사이트 열기 </a><br>
   4. <a href="mailto:[email protected]> E-mail보내기</a><br>
             : outlook에 계정을 등록한 후에만 사용가능하다. (smtp와 pop3주소)
   5. <a href="acdsee.exe"> 실행파일 연결(download) </a><br>
             : 파일을 다운로드 받는 창이 뜬다. (유틸리티 파일 올릴때.)
 
   6. link 색상 관련 속성 : <body> 안에 들어감.
       :  <BODY  link = "red" vlink="orange" alink ="blue">
             - vlink : 방문했던 링크의 색상, alink : 링크를 클릭하는 순간의 색상
   7. 이미지에 링크걸기
      : <a href="http://www.nkino.com" target ="_blank">
       <img src="images/img02.jpg" align ="right" hspace="10" vspace ="10"  border = 0 >
       </a>   → 링크를 걸면 이미지에 border가 자동으로 생기므로 없애줄 것.
 
================================================================
* 사운드 파일 연결하기
             - 외부 사운드 파일 재생
                           : <a href ="evergreen.mp3">음악듣기</a><br><br>
             - 자동으로 시작하는 배경음악 삽입
                           : <embed src="evergreen.mp3"  >
               속성1.  hidden =true : 컨트롤러를 화면에 안보여줌.
 
<table> - 교재88p ~
 
* table 만들기
     1. 기본틀
             <table>
             <tr> 
                           <td></td>
                           <td></td>
                           <td></td>
             </tr>
 
     2. 3*3의 테이블 작성.(border의 기본값은 0으로 테두리선은 없음. 주로 0이나 1만 사용됨)
       <table border=1>  
             <tr> 
                           <td>박찬호</td>
                           <td>박세리</td>
                           <td>박지은</td>
             </tr>
             <tr> 
                           <td>지진희</td>
                           <td>이나영</td>
                           <td>정진영</td>
             </tr>
             <tr> 
                           <td>한채영</td>
                           <td>선우용녀</td>
                           <td>한희</td>
             </tr>
        </table>
 
    3. 셀의 안여백조절 : cellpadding , 셀과 셀 사이의 여백 조절 : cellspacing
        : <table border=1 bordercolor = "blue" cellspacing="10"  cellpadding="10">
 
    4. 제목이 들어갈 칸 : <th> </th>
 
    5. 테이블 바탕지정
      <table border=1 bordercolor = "blue" cellspacing="10"  cellpadding="10"            bgcolor="yellow"> : 바탕색 지정
     <table border=1 bordercolor = "blue" cellspacing="10"  cellpadding="10" background                       
            'images/bg_fam01.jpg" width="600" height="600"> : 배경그림과 크기 지정
 
  6. 선의 색으로 table에 입체감을 느끼게..
 <table border=3 bordercolor = "blue" cellspacing="10"  cellpadding="10" background      
   ="images/bg_fam01.jpg"  width="600" height="600" bordercolordark="#FF0000"
    bordercolorlight="#FFCC00">
 
* 두번째 테이블
    1. 행 전체 색 지정  해서 메뉴로 활용할 수 있다.
             <br>
             <table width ="90%" align="center" cellpadding=4" cellspacing="4">
                           <tr bgcolor="#FFCC33">
                                        <td >이나영 </td>
                                        <td> 정진영</td>
                                        <td> 한채영</td>
                                        <td> 양동근</td>
                           </tr>
             </table>
             ★ cellspacing 값을 주고, border값을 0으로 하면 서로 분리된 효과가 됨.
 
*  테이블 만들기 연습
 
   <table border ="1" width="500" height="100" bordercolor="blue">
             <tr >
                           <td  rowspan="2"> a </td>
                           <td colspan="4"> b </td>
             </tr>
             <tr>
                           <td colspan="2"> g </td>
                           <td  colspan="2"> i </td>
             </tr>
             <tr>
                           <td rowspan="2"> k </td>
                           <td> l </td>
                           <td rowspan="2"> m </td>
                           <td> n </td>
                           <td rowspan="2">o</td>
             </tr>
             <tr>
                           <td> q </td>
                           <td> s </td>
             </tr>
</table>
 
* 테이블 만들기 실습
<br>
<table border="1" bordercolor="red">
             <tr>
                           <td  colspan="4"> <img src ="images/ky01.jpg"></td>
                                        ( 테이블에 그림삽입 예)
             </tr>
             <tr>
                           <td colspan="2" width="200"> <A HREF=""><img src ="images/ky01.jpg"></A>
                                        </td>     ----> 테이블안의 이미지에 링크걸기
                           <td colspan="2" width="200">g</td>
             </tr>
             <tr>
                           <td rowspan="2">i</td&
트위터 트위터 페이스북 페이스북 카카오톡 카카오톡
기사입력: 2006/08/26 [08:27]  최종편집: ⓒ iwav
 
 
많이 본 기사