[HTML][HTML문서][웹페이지]HTML의 구성요소, HTML의 문서구조와 HTML의 문자편집, HTML의 색편집, HTML의 목록편집, HTML의 표편집, HTML의 링크편집 및 HTML의 멀티미디어 삽입 분석

소개글

[HTML][HTML문서][웹페이지]HTML의 구성요소, HTML의 문서구조와 HTML의 문자편집, HTML의 색편집, HTML의 목록편집, HTML의 표편집, HTML의 링크편집 및 HTML의 멀티미디어 삽입 분석에 대한 보고서 자료입니다.

목차

Ⅰ. 개요

Ⅱ. HTML의 구성 요소
1. 요소(Elements)
2. 태그(Tag)
3. 속성(Attributes)
4. 변수(Argument)

Ⅲ. HTML의 문서 구조
1. HTML문서의 전체 구조
1) 문서 구조 : HTML
2) 헤드부
3) 제목 : TITLE
4) 기타 tag
2. BODY
3. HTML의 머리글
4. 순서 없는 목록(unordered list)보이기
5. 순서 있는 리스트(ordered list) 보이기
6. 메뉴 목록 보이기
7. 디렉토리 목록 보이기
8. Line Break : BR
9. Horizontal Rule : HR
10. Image : IMG

Ⅳ. HTML의 문자 편집

Ⅴ. HTML의 색 편집

Ⅵ. HTML의 목록 편집
1. 기타목록 만들기
2. 용어정의목록 만들기

Ⅶ. HTML의 표 편집

Ⅷ. HTML의 링크 편집
1. 외부링크
2. 내부링크

Ⅸ. HTML의 멀티미디어 삽입
1. 그림 넣기
1) 그림(Image)
2) 넷스케이프 지원 그림형식
3) 그림(Image)파일의 저장위치
4) 그림 넣기
2. 그림으로 연결하기
3. 사운드 파일 넣기
4. 비디오 파일 넣기
5. 자동 실행

참고문헌

본문내용

들기
형식)

단독 TAG>

단독 TAG>

①defiuition list: 용어정의목록의 시작과 끝을 지정하며

~

로 표시한다.
②defiuition term: 용어정의목록의 제목글로

~

사이에 기술하며 단독 TAG문이다.
③defiuition description: 용어정의목록의 설명글로

~

사이에 기술되며 단독TAG문이다.

문은

문 보다 안쪽(들여쓰기)에 표시된다.
Ⅶ. HTML의 표 편집
- … : 테이블을 만드는 기본 태그이다.
- … : 테이블을 제목을 표시하는 태그이다.
- … : 테이블 행을 의미한다.
- … : 테이블 데이터를 나타내는 태그이다.
- … : 특정 자료를 강조하는 효과를 나타내는 태그이다.
- border=n : 테이블의 태두리선의 두께를 나타낸다.
- width=\"n\"│n% : 테이블의 가로 폭을 지정한다.
- height=\"n\"│n% : 테이블의 세로 폭을 지정한다.
- cellspacing=\"n\" : 테이블에 사용되는 모든 선의 굵기를 조정한다.
- cellpadding=\"n\" : 테이블과 테이블 내의 문자와의 간격을 조정한다.
- align=\"left│center│right\" : 글자의 좌우정렬을 설정하는 속성이다.
- rowspan=\"n\" : 테이블의 셀을 행 단위로 확장하는 속성이다.
- colspan=\"n\" : 테이블의 셀을 열 단위로 확장하는 속성이다.
Ⅷ. HTML의 링크 편집
1. 외부링크
현재 사용하는 문서가 안니 다른 HTML문서로의 이동, 그림으로의 이동, 웹사이트로의 이동 등을 말한다.

- HTML문서의 외부에 있는 사이트주소, HTML문서, 이미지, 파일 등을 연결하여 링크를 만들 때 사용한다.
2. 내부링크
HTML문서 안에서의 이동을 의미한다.
...를 원하는 위치에 표시함으로써 링크 부분을 클릭했을 경우, 이동 위치를 지정해 주는 역할을 한다. 또한 책갈피 이름 부분에 다른 문서의 책갈피도 지정할 수 있으므로, 과 같이 표시하여 외부 링크와 내부 링크를 함께 만들 수 있다.
Ⅸ. HTML의 멀티미디어 삽입
1. 그림 넣기
1) 그림(Image)
HTML문서에 그림(Image)을 포함시킬 수 있는데, 그림형식은 넷스케이프 같은 브라우저에서 바로 볼 수 있는 것이 있고 별도의 그래픽 프로그램을 사용하여야만 볼 수 있는 것이 있다.
- 인라인 그림(Inline Image) : 브라우저로 바로 볼 수 있는 그림
- 외부 그림(External Image) : 브라우저로 바로 볼 수 없는 그림
그러므로 홈페이지에 포함되는 그림은 가능한 한 「인라인 그림」을 사용하는 것이 좋다.
2) 넷스케이프 지원 그림형식
대부분의 브라우저 프로그램에서 바로 볼 수 있는 인라인 그림형식은 GIF, JPG 형식의 그림 파일이다. 유의할 것은 GIF 포맷일 경우 256칼라로 셋팅이 된다는 점을 알아야 한다.
3) 그림(Image)파일의 저장위치
그림파일은 홈페이지 HTML문서 파일과 같은 디렉토리에 저장하는 것이 가장 무난하다. 즉 인터넷서비스 회사의 호스트 컴퓨터 디렉토리에 HTML문서를 저장할 때 관련 그림파일도 같은 디렉토리에 저장하도록 하는 것이다.
4) 그림 넣기

(그림파일 이름)의 그림을 브라우저 화면에 나타내준다.
사용형식 예
: \"dragon.gif\" 그림파일을 나타낸다.
2. 그림으로 연결하기
브라우저 화면의 그림을 마우스로 클릭 할 때 특정 HTML문서나 웹사이트(Web Site)로 연결, 이동할 수 있으며, 그림끼리 재차 연결하는 것도 가능하다.

(그림파일 이름)의 그림을 클릭하면 dragon.html\"문서로 연결된다.

그림(223.gif)을 클릭하면 \"link-a.html\"문서로 연결된다.
3. 사운드 파일 넣기
홈페이지에 WAV, AU 같은 사운드 파일을 포함시킬 수 있다. 그래서 웹사이트를 접속한 사람에게 단순한 글뿐만 아니라 멀티미디어로 정보를 제공할 수 있는 것이다.
음악
음악을 클릭하면 음악파일 이름의 사운드파일이 접속한 사람에게 전송된다. 접속한 사람은 넷스케이프와 연결된 사운드구동 프로그램으로 사운드를 들어볼 수 있다.
4. 비디오 파일 넣기
홈페이지에 AVI, MPG, MPEG 같은 비디오 파일을 포함시킬 수 있다. 그래서 웹사이트를 접속한 사람에게 단순한 글뿐만 아니라 멀티미디어로 정보를 제공할 수 있는 것이다.
비디오
비디오 글자를 클릭하면 비디오 파일 이름의 비디오 파일이 접속한 사람에게 전송된다. 접속한 사람은 넷스케이프와 연결된 비디오 구동 프로그램으로 동화상을 들어볼 수 있다.
5. 자동 실행
홈페이지에 접속하면 자동으로 음향 파일을 자동으로 실행시킬 수 있다.
참고문헌
고영수(1996), 원클릭으로 떠나는 홈페이지 정보사냥, 영진
문용택 외, 멀티미디어 홈페이지 디자인 제작가이드-홈페이지 기획부터 제작까지, 영진닷컴
최윤철, 인터넷 배움터, 생능 출판사
척 무시아노, 빌, HTML과 XHTML 핵심 가이드, 케네디 출판사 : 한빛 미디어
Homer,Alex 외(1998), 인스틴트 다이나믹 HTML
Neil Randall 저, 정경희·조가원 역(1996), 단계별로 풀어보는 홈페이지, 씨에이
MURDOCK, MASTER VIS HTML4 & XHTML, 에이콘출판(주)

키워드

HTML,   HTML문서,   홈페이지,   인터넷,   웹페이지