목차 일부
추천사
역자서문
저자서문
Part 1 CSS기초 ... 33
1장 CSS를 위한 HTML 인식 전환 ... 35
HTML : 과거와 현재 ... 35
HTML 과거 : 좋아보이기만 하면 그만이다 ... 36
HTML 현재 : CSS를 위한 뼈대로 ... 38
CSS를 위한 HTML 작성하기 ... 38...
더보기
목차 전체
추천사
역자서문
저자서문
Part 1 CSS기초 ... 33
1장 CSS를 위한 HTML 인식 전환 ... 35
HTML : 과거와 현재 ... 35
HTML 과거 : 좋아보이기만 하면 그만이다 ... 36
HTML 현재 : CSS를 위한 뼈대로 ... 38
CSS를 위한 HTML 작성하기 ... 38
구성 생각하기 ... 38
알아야 할 새로운 HTML 태그 두 개 ... 39
잊어야 할 HTML ... 41
여러분을 인도해 줄 조언 ... 44
Doctype의 중요성 ... 45
2장 스타일 및 스타일시트 작성 ... 49
스타일에 대한 분석 ... 49
스타일시트의 이해 ... 52
내부냐, 외부냐 - 선택의 기준 ... 52
내부 스타일시트 ... 53
외부 스타일시트 ... 54
HTML을 이용한 스타일시트의 연결 ... 55
CSS를 이용한 스타일시트의 연결 ... 56
확인학습 : 첫 스타일의 작성 ... 58
인라인 스타일 작성 ... 59
내부 스타일시트 작성 ... 60
외부 스타일시트 작성 ... 63
3장 선택자 기초 : 스타일 대상 확인 ... 67
태그 선택자 : 페이지 전체 스타일 정의 ... 68
클래스 선택자 : 세부적인 조절 ... 69
ID 선택자 : 특정 페이지 엘리먼트 ... 71
태그에 포함된 태그 스타일 정의 ... 74
HTML 가계도 ... 75
하위 선택자 구성하기 ... 76
태그 그룹의 스타일 정의 ... 78
그룹 선택자 생성하기 ... 79
전체 선택자(*) ... 79
가상 클래스 및 가상 엘리먼트 ... 80
링크의 스타일 정의 ... 80
그밖의 가상 클래스 및 가상 엘리먼트 ... 81
고급 선택자 ... 85
자식 선택자 ... 85
인접 동기 선택자 ... 86
애트리뷰트 선택자 ... 87
확인학습 : 선택자 종합 선물 세트 ... 88
그룹 선택자 생성 ... 91
클래스 선택자의 생성 및 적용 ... 92
ID 선택자의 생성 및 적용 ... 94
하위 선택자 생성 ... 96
4장 상속을 통한 시간 절약 ... 99
상속이란? ... 99
상속으로 스타일시트를 효율화하는 방법 ... 100
상속의 제한 ... 102
확인학습 : 상속 ... 103
기초 예제 : 1단계 상속 ... 104
상속을 이용하여 페이지 전체의 스타일 재정의하기 ... 105
상속 무활동 ... 107
5장 다중 스타일 관리 : 캐스케이드(종속) ... 109
스타일의 캐스케이드 원리 ... 110
상속 스타일의 누적 ... 110
가장 인접한 피상속자가 우선한다 ... 111
직접 적용된 스타일이 우선한다 ... 112
태그는 하나, 스타일은 여러 개 ... 113
특정도 : 어느 스타일이 우선하느냐 ... 115
연장전 : 최후의 스타일이 우선한다 ... 117
캐스케이드 조정하기 ... 118
특정도 변경하기 ... 119
선택적 오버라이딩 ... 119
확인학습 : 캐스케이드 실습 ... 121
혼성 스타일의 작성 ... 121
캐스케이딩과 상속의 연결 ... 123
충돌 해소 ... 124
Part 2 CSS적용 ... 127
6장 텍스트 형식 정의하기 ... 129
텍스트 형식 정의 ... 129
글꼴 선택 ... 131
텍스트에 색상 입히기 ... 132
글꼴 크기 변경 ... 134
픽셀을 이용하는 방법 ... 135
키워드, 백분율, Em을 이용하는 방법 ... 135
단어 및 문자의 형식 정의 ... 140
이탤릭체화 및 볼드체화 ... 140
대/소문자 전환 ... 141
Decorating ... 142
문자 및 단어 간격 ... 143
단락 전체의 형식 정의 ... 145
줄 간격 조정 ... 145
텍스트 정렬 ... 147
첫 줄 들여쓰기 및 여백 없애기 ... 148
첫 글자나 단락 첫 줄의 형식 정의 ... 149
목록 스타일 정의하기 ... 150
목록의 유형 ... 150
블릿과 번호의 위치 지정 ... 153
이미지 블릿 ... 155
확인학습 : 텍스트 형식 정의 실습 ... 156
페이지 설정하기 ... 156
머리글자 및 단락의 형식 지정 ... 158
목록의 형식 지정 ... 160
마무리 손질하기 ... 163
7장 Margin, Padding, Border ... 165
박스 모델의 이해 ... 165
Margin과 Padding으로 공간 조절하기 ... 167
Margin 및 Padding의 간략한 표기 ... 168
여러 Margin 사이의 충돌 ... 169
음수 Margin을 이용하여 간격 없애기 ... 171
인라인 및 블록 - 계층 박스 표시하기 ... 172
테두리 넣기 ... 174
Border 프로퍼티의 간략한 표기 ... 175
개별 테두리의 형식 정의 ... 176
배경색 넣기 ... 178
높이와 폭 정하기 ... 179
박스의 실제 너비와 높이 계산하기 ... 180
Overflow 프로퍼티로 탭 조절하기 ... 182
IE 5에서 깨지는 박스 모델 바로잡기 ... 183
부유 엘리먼트로 내용 감싸기 ... 187
배경, 테두리, 부유 엘리먼트 ... 189
Float 해제 ... 190
확인학습 : 여백, 배경, 테두리 ... 192
페이지 여백 조정하기 ... 193
태그 주변 공간조정하기 ... 194
배경 및 테두리를 넣어 텍스트 강조하기 ... 195
사이드 바 제작 ... 198
브라우저 버그 바로잡기 ... 201
좀더 해보기 ... 204
8장 웹페이지에 그림 넣기 ... 205
CSS와〈img〉태그 ... 205
배경 이미지 ... 207
반복 제어하기 ... 209
배경 이미지의 위치 지정 ... 211
Keyword ... 212
정확한 값 ... 213
백분율 값 ... 214
제자리에 이미지 고정시키기 ... 216
Background 프로퍼티 속기법의 이용 ... 217
확인학습 : 사진 갤러리 제작 ... 219
이미지에 테두리 넣기 ... 219
캡션 넣기 ... 221
사진 갤러리 만들기 ... 225
드롭 쉐도우 넣기 ... 229
확인학습 : 배경 이미지 사용하기 ... 231
페이지의 배경에 이미지 넣기 ... 232
테두리를 그림으로 대체하기 ... 236
블릿 목록에 이미지 블릿 사용하기 ... 237
사이드 바에 둥근 모서리 넣기 ... 239
외부 스타일시트 제작하기 ... 243
9장 사이트에 내비게이션 달기 ... 245
스타일을 정의할 대상 링크 선정하기 ... 245
링크 상태에 대한 이해 ... 246
특정 링크를 대상화하기 ... 247
링크 스타일 정의하기 ... 249
링크에 밑줄 넣기 ... 249
버튼 제작 ... 251
이미지 사용하기 ... 253
내비게이션 바 제작 ... 255
비순차 목록 이용하기 ... 255
세로 내비게이션 바 ... 257
가로 내비게이션 바 ... 259
고급 링크 기법 ... 265
커다란 클릭 버튼 ... 265
CSS 방식의 프리로딩 롤오버 ... 267
미닫이 문 ... 269
확인학습 : 링크 스타일 정의하기 ... 271
기본적인 링크 형식 지정 ... 271
링크에 배경 이미지 넣기 ... 273
외부 링크에 하이라이트 주기 ... 275
방문한 페이지 표시하기 ... 277
세로 내비게이션 바 제작 ... 278
롤오버 추가와 '현재 페이지' 링크 생성 ... 282
IE 버그 바로잡기 ... 285
세로를 가로로 ... 286
10장 테이블 및 폼의 형식 정의 ... 291
테이블 올바로 사용하기 ... 291
테이블 스타일 정의하기 ... 293
Padding 넣기 ... 294
세로와 가로 정렬 조정하기 ... 295
테두리 생성 ... 296
행과 열의 스타일 정의 ... 297
폼 스타일 정의하기 ... 299
HTML 폼 엘리먼트 ... 300
CSS를 이용하여 폼 레이아웃 하기 ... 302
확인학습 : 테이블 스타일 정의하기 ... 305
확인학습 : 폼 스타일 정의하기 ... 309
Part 3 CSS 페이지 레이아웃 ... 315
11장 Float을 이용한 레이아웃 제작하기 ... 317
CSS 레이아웃의 동작 원리 ... 317
중요한〈div〉태그 ... 318
웹페이지 레이아웃의 종류 ... 319
부유 레이아웃의 기초 ... 322
레이아웃에 부유 엘리먼트 적용하기 ... 325
전체 단 부유시키기 ... 326
부유 엘리먼트에 포함된 부유 엘리먼트 ... 328
음수 Margin을 이용하여 엘리먼트 배치하기 ... 329
Float의 문제점 해소 ... 334
Float의 해제와 포장 ... 334
단을 전체 높이에 꽉 차게 하기 ... 337
플로트 드롭의 방지 ... 341
인터넷 익스플로러의 버그 다루기 ... 344
이중여백 버그 ... 344
3px 간격 버그 ... 346
기타 IE의 문제점 ... 348
확인학습 : 다단 레이아웃 ... 349
HTML 구조화하기 ... 350
레이아웃 스타일 작성 ... 351
단 하나 더 넣기 ... 352
'가짜 단' 넣기 ... 353
너비 고정하기 ... 356
확인학습 : 음수 Margin 레이아웃 ... 357
레이아웃의 중앙 정렬 ... 358
단 이동하기 ... 361
최종 수정 ... 364
12장 웹페이지 상에 엘리먼트 위치 지정 ... 367
위치 지정 프로퍼티의 동작 원리 ... 368
위치 지정 값 할당하기 ... 370
절대 위치 지정이 상대적인 경우 ... 374
상대 위치 지정을 사용하는 경우와 그 대상 ... 375
엘리먼트 쌓아올리기 ... 378
페이지의 일부 가리기 ... 379
막강한 위치 지정 기법들 ... 381
엘리먼트 내에서의 위치 지정하기 ... 381
엘리먼트를 박스 밖으로 삐져나오게 하기 ... 382
CSS의 위치 지정을 이용하여 페이지 레이아웃하기 ... 384
고정 위치 지정을 이용하여 CSS 스타일의 테두리 제작하기 ... 389
확인학습 : 페이지 엘리먼트의 위치 지정 ... 393
페이지 배너 개선하기 ... 393
사진에 캡션 넣기 ... 398
페이지 레이아웃 하기 ... 400
Part4 CSS 고급 ... 407
13장 인쇄 페이지를 위한 CSS ... 409
미디어 스타일시트의 동작 원리 ... 410
미디어 스타일시트를 추가하는 방법 ... 412
외부 스타일시트에 대한 미디어 유형 명기 ... 412
스타일시트 내부에 미디어 유형 명기 ... 413
인쇄용 스타일시트의 작성 ... 414
화면용 스타일 정의를 무효화하기 위한 !important 사용 ... 414
텍스트 스타일 뜯어 고치기 ... 415
인쇄용으로 배경 스타일 정의하기 ... 417
불필요한 페이지 영역 감추기 ... 419
인쇄용 페이지 구분선 넣기 ... 421
확인학습 : 인쇄용 스타일시트 작성하기 ... 422
불필요한 페이지 엘리먼트 삭제 ... 422
배경삭제와 레이아웃 조정 ... 424
텍스트의 형식 재정의하기 ... 426
로고 나오게 하기 ... 427
URL 나오게 하기 ... 427
14장 CSS 코딩습관 개선하기 ... 429
주석 달기 ... 429
스타일과 스타일시트의 체계화 ... 431
스타일 이름은 간명하게 ... 431
다중 클래스를 사용하여 시간 절약하기 ... 432
스타일들을 그룹으로 묶어 조직화하기 ... 434
다중 스타일시트 이용하기 ... 435
브라우저의 스타일 간섭 없애기 ... 438
하위 선택자 사용하기 ... 441
페이지 분할하기 ... 442
섹션별 Body 구분짓기 ... 444
인터넷 익스플로러 핵 관리하기 ... 446
먼저 최신 브라우저에 맞추어 디자인하자 ... 447
조건부 주석으로 IE용 CSS 코드 분리하기 ... 448
부록 A : CSS 프로퍼티 참고자료 ... 453
부록 B : 드림위버 8에서 CSS 작성방법 ... 487
부록 C : CSS 참고자료 ... 511
찾아보기 ... 521
더보기 닫기