목차

Part 1. HTML

Chapter 01 초보를 위한 HTML 가이드
홈페이지를 제작하기 위한 HTML 16
HTML 구조 파악하기 17
태그 파악하기 18
HTML 문서를 구성하는 기본 태그 4가지 18
HTML 문서 작성과 확인 20
소스 내에 주석 삽입하기 〈!-- --〉 21
어떤 웹 에디터를 사용할 것인가? 22
HTML 문서를 만드는 도구 22
에디트 플러스의 특징 22
드림위버의 특징 23
나모의 특징 24

Chapter 02 HTML의 가장 기본이 되는 태그 정복하기
body 태그에 사용되는 속성 25
HTML 문서에 배경색 지정하는 bgcolor 속성 26
HTML 문서에 배경 그림 지정하는 background 속성 27
줄 바꿈과 공백처리하기 29
줄을 바꾸는 〈br〉 태그 29
문단 나누는 〈p〉 태그 31
공백 처리하는   34
특수 문자 출력하는 &특수이름, &#아스키코드 35
입력한 대로 보여주는 〈pre〉 태그 36
내용을 가운데로 정렬하는 〈center〉 태그 37
구분선을 그리는 〈hr〉 태그 38
제목을 위한 〈Hn〉 태그 40
제목 정렬하기 41

Chapter 03 텍스트를 내 마음대로 표현하기
글꼴을 다양하게 바꾸는 〈FONT〉 42
글자의 크기를 바꾸는 size 속성 43
글자의 색상 지정하는 color 속성 44
글꼴을 변경하는 face 속성 46
기본 글자 크기 지정하는 〈BASEFONT〉 태그 46
글자의 크기를 상대적으로 지정하기 47
글자에 장식효과를 주는 태그들 48
문서 전체의 텍스트 색상 지정하기 50
다른 문장과의 구별을 위한 〈BLOCKQUOTE〉 태그 51
문서 작성자를 알리기 위한 〈ADDRESS〉 태그 52
목록에 관련된 태그 53
순서가 없는 목록 나열하는 〈UL〉 태그 53
순서가 있는 목록 나열하는 〈OL〉 태그 55
정의 목록을 나열하는 〈DL〉 태그 57
움직이는 텍스트를 만드는 〈MARQUEE〉 태그 58
〈MARQUEE〉 태그의 behavoir 속성 59
〈MARQUEE〉 태그의 direction 속성 61
〈MARQUEE〉 태그의 scrolldelay, scrollamount 속성 62
〈MARQUEE〉 태그의 bgcolor, loop 속성 63

Chapter 04 이미지 태그로 화려하게 꾸미기
이미지 태그 64
이미지 삽입하기 위한 src 속성 65
상대 경로 절대 경로 66
이미지에 설명을 나타내는 alt 속성 68
이미지의 테두리선을 변경하는 border 속성 69
이미지와 함께 있는 글자의 위치를 지정하는 align 속성 70
이미지의 위치를 지정하는 align 속성 71
이미지 주변에 여백을 설정하는 vspace와 hspace 속성 72
이미지의 표시 크기 조절하는 width와 height 속성 74

Chapter 05 
하이퍼링크로 다양한 문서 연결하기
하이퍼링크를 위한 〈A〉 태그와 속성들 77
이동할 위치 지정하는 href 속성 78
링크의 색상 지정하기 79
다른 홈페이지로 연결하기 80
다른 홈페이지 링크로 이용하기 81
이미지로 링크 82
이메일을 보내는 하이퍼링크 84
현재 HTML 문서의 지정된 위치로 링크를 설정하는 name 속성 85
절대 경로와 상대 경로 88
음악, 동영상 파일 링크하기 89
압축파일, 실행 파일 링크하기 90
링크 결과를 다른 창에 열기 91

Chapter 06 테이블로 깔끔하게 문서 정리하기
테이블로 웹 문서의 레이아웃 설정 92
테이블의 기본 구조 93
테이블 만드는 〈table〉 태그 94
셀 만드는 〈tr〉, 〈td〉 태그 95
테이블에 테두리 표시와 빈 셀 작성하기 96
테이블 안에 이미지 삽입하기 97
테이블 제목과 셀 제목 지정하는 〈caption〉, 〈th〉 태그 98
테이블의 속성 지정하기 100
테이블을 정렬하는 align 속성 101
테이블의 테두리 두께 지정하는 border 속성 103
테이블에 여백을 주는 cellspacing, cellpadding 속성 104
테이블 크기 조절하는 width, height 속성 106
테이블로 이미지와 텍스트를 혼합하여 출력 107
테이블 배경색 지정하는 bgcolor 속성 108
테이블 테두리 색 지정하는 bordercolor 속성 109
테이블 배경 이미지 지정하는 background 속성 110

Chapter 07 테이블에 한 발짝 더 다가가기
테이블의 〈TR〉, 〈TD〉 태그의 속성 112
〈tr〉 태그의 속성 112
〈td〉 태그의 속성 113
〈th〉 태그의 속성 113
셀 안의 내용을 좌우 정렬하는 align 속성 114
셀 내용을 상하 정렬하는 valign 속성 115
셀의 너비와 높이 조정하는 width, height 속성 116
셀을 합치는 rowspan, colspan 속성 118
셀에 부분적으로 색상 지정하는 bgcolor 속성 119
셀 내용 줄 바꾸지 않고 그대로 출력하기 121
테이블을 이용하여 화면 분할 122
테이블 안에 테이블 만들기 123

Chapter 08 프레임 작성하기
프레임을 만들기 위한 〈frameset〉 태그 125
프레임에 파일 연결하는 src 속성 127
세로(위아래)와 가로(좌우)를 복합 분할하기 128
프레임의 크기 변경 금지하는 noresize 속성 129
스크롤바 표시하기 131
프레임에 여백주는 marginwidth, marginheight 속성 133
타켓 정하는 target, name 속성 134
창 안에 작은 창 IFRAME 태그 136
프레임 테두리의 두께와 색상 조절 137
프레임 테두리 없애기 138
스크롤바가 없는 창 139

Chapter 09 입력 양식 작성하기 
입력 양식 폼 140
폼 양식을 만드는 〈form〉 태그 141
데이터를 입력받기 위한 〈input〉 태그 142
암호를 입력받기 위한 password 143
여러 라인의 글자를 입력받기 위한 〈textarea〉 태그 144
체크 박스를 위한 checkbox 146
라디오 버튼을 위한 radio 147
명령을 지시하는 버튼을 위한 button 148
전송버튼과 입력취소버튼을 위한 submit, reset 149
콤보 박스와 리스트 박스를 위한 〈select〉 태그 150
회원 가입 페이지 만들기 152


Part 2. CSS

Chapter 01 통일감 있는 HTML 문서를 위한 CSS 가이드
스타일 시트란? 158
스타일 시트로 가능한 작업에 무엇이 있을까요? 159
스타일 시트의 기본 형식 159
여러 가지 속성을 설정하기 160
홈페이지에 스타일 설정하여 적용하기 161
〈head〉 태그에 스타일 설정하는 embedding 스타일 162
외부 파일에 존재하는 스타일 시트 파일을 HTML에 삽입하는 link 스타일 163
HTML 문서의 태그에서 직접 스타일 설정하는 inline 스타일 165
특정 부분에서만 스타일 적용하기 166
class로 속성 정의하기 166
ID로 속성 정의하기 169

Chapter 02 글꼴 문단 지정하기
글꼴 꾸밈 관련 스타일 시트 172
텍스트 관련 스타일 시트 174
배경 관련 스타일 시트 175
배경에 이미지에 관련된 background-image/background-repeat 속성 176
배경 이미지의 위치 조정하는 background-position 속성 178
배경 이미지 고정하는 background-attachment 속성 180
목록 관련 스타일 시트 182
하이퍼링크 관련 스타일 시트 184

Chapter 03 테두리 여백 지정하는 속성
테두리를 제어하는 스타일 시트 187
외부여백(Margin)과 내부여백(Padding)관련 속성 190
위치 관련 속성 192


Part 3. JavaScript

Chapter 01 자바스크립트 개요
자바스크립트란? 198
자바스크립트의 기본 구조 199
head 부분에 자바스크립트 포함하기 199
body 부분에 자바스크립트 포함하기 200
자바스크립트 외부에서 불러들이기 201
자바스크립트 부분을 주석 문으로 처리하기 202
자바스크립트의 자료 형(DATA TYPE) 203
자료형의 종류 204
변수 만드는 방법 207
변수 사용하기 208
연산자란 210
산술 연산자 210
관계 연산자 212
논리 연산자 213
자바스크립트에 내장된 대화 상자를 이용한 인터페이스 215
alert 함수 215
confirm 함수 216
prompt 함수 217
여러 문장 중 한 문장만 선택하여 실행하도록 하는 선택문 218
if 문 219
switch 문 220
문장을 여러 번 반복 수행할 수 있게 하는 반복문 222
for 문 222
while 문 224
do while 문 225
continue 문-제어문을 보조하는 명령문 226
break 문-제어문을 보조하는 명령문 227
반복 사용되는 문장을 기능적으로 나누어 정의하는 함수 228
내장 함수 228
문자열을 정수로 변환하는 parseInt 함수 229
사용자 정의 함수 230

Chapter 02 자바스크립트의 객체
자바스크립트에서 사용되는 객체의 개념 이해하기 233
객체 지향 프로그램이란? 233
내장 객체란? 234
날짜와 시간을 관리 해주는 Date 객체 235
Date 객체 생성하기 235
배열을 사용할 수 있도록 하는 Array 객체 240
문자열을 다루도록 하는 String 객체 242
문자열의 개수를 나타내주는 length 속성 242
문자열 메소드 살피기 242
문자열을 하이퍼 링크로 설정하는 link( ) 메소드 243
특정 위치로 이동하게 하는 anchor( ) 메소드 244
문자열 중 원하는 위치의 문자를 찾아주는 charAt( ) 메소드 246
검색 메소드 indexOf( )와 lastIndexOf( ) 248
문자열을 추출하는 substring( ) 메소드 249
문자열을 추출하는 slice( ) 메소드 251
문자열을 추출하는 substr( ) 메소드 252
문자열을 대소문자로 변경하는 toUpperCase( )/toLowerCase( ) 메소드 253
문자열을 연결하는 concat( ) 메소드 254
문자열을 분리하는 split( ) 메소드 255
수학 공식을 제공하는 Math 객체 256
화면의 정보를 알려주는 Screen 객체 260

Chapter 03 브라우저 객체
브라우저 객체 이해하기 262
브라우저 객체의 계층구조 263
브라우저 객체의 접근 방법 264
창을 제어하는 window 객체 265
상태 표시바에 글자를 표시하는 defalutstatus/status 속성 266
창 속성의 종류 267
새로운 창을 열어주는 window.open( ) 메소드 268
창을 닫는 window.close( ) 메소드 270
타이머 설정과 해제를 위한 setTimeout/clearTimeout 메소드 272
타이머 설정과 해제를 위한 setInterval/clearInterval 메소드 273
하위 창을 열어준 부모 창을 가르키는 opener 275
창을 분할하는 프레임을 제어하는 Frame 객체 277
프레임의 위치를 지정하는 frames 277
자신의 상위 계층을 지칭하는 parent 278
〈FRAME〉 태그의 NAME 속성을 프레임 객체로 사용하기 281
자신의 최상위 계층을 지칭하는 top 282
왼쪽 프레임의 단추를 클릭하여 오른쪽 프레임의 그림을 변경하기 284
자기 자신이 속한 프레임을 지칭하는 self 286
최근 방문한 주소를 기억하는 history 객체 286
히스토리 리스트의 개수를 알려주는 length 속성 287
뒤로 앞으로 이동하게 해주는 back( )/forward( ) 메소드 288
여러 단계씩 뒤로 앞으로 이동하게 하는 go( ) 메소드 290
주소 입력란의 주소 정보를 제어하는 location 객체 291
현재 문서의 URL 주소를 알려주거나 설정하는 href 속성 291
입력한 URL로 문서를 이동하는 replace( ) 메소드 294
문서를 다시 읽어 들이는 reload( ) 메소드 296
브라우저의 정보를 제공해주는 Navigator 객체 097
자바를 사용할 수 있는지 판단해 주는 javaEnabled( ) 메소드 298
웹 브라우저를 판별하기 299

Chapter 04 document 객체와 image 객체
document 객체 302
문서에 문자열을 출력하는 write( ) 메소드 303
문서 제목 줄의 정보를 알려주는 title 속성 305
문서의 최종 수정날짜를 표시해 주는 lastmodified 속성 306
웹 페이지의 배경색을 변경하는 bgColor 속성 308
웹 페이지의 글자색을 변경하는 fgColor 속성 310
문서를 열고 닫는 open/close 메소드 312
그림에 대한 정보를 알려주는 Image 객체 314
이미지를 선택해주는 images 객체 315
그림 파일의 경로를 알려주는 src 속성 317
이미지 객체로 객체 변수를 선언하여 사용하기 319
이미지 메뉴 만들기 322

Chapter 05 폼 객체
입력양식을 제어하는 form 객체 325
form 객체의 개념 325
특정 폼을 구별해주는 forms 속성 326
〈form〉 태그의 name 속성을 폼 객체로 사용하기 327
정보를 입력하는 text 객체 328
〈input type=“text”〉 태그의 name 속성을 text 객체로 사용하기 328
글 상자에 입력된 값을 알려주는 value 속성 329
이벤트를 발생하는 button 객체 330
체크 박스를 위한 checkbox 객체 332
배타적 선택을 하는 radio 객체 333
select 객체 336
선택된 항목의 번호를 알려주는 selectedIndex 속성 338
목록 상자의 항목을 선택하였을 때 발생하는 onChange 핸들러 339
기타 객체 341
submit 객체 341
submit 메소드 343
onSubmit 이벤트 핸들러 345
file 객체와 hidden 객체 346
Chapter 06 
자바스크립트 활용하기
DHTML 348
레이어 개체 개념 이해하기 348
layer 객체 351
layer 객체의 속성/메소드 352
레이어 위에 마우스를 올려놓으면 그림이 나타나도록 하는 예제 354
레이어로 서브 메뉴 만드는 예제 358