HOME > 상세정보

상세정보

(사전처럼 바로 찾아 쓰는) HTML5 + CSS3 디자인 패턴 : 레고처럼 조합하는 웹 디자인 패턴 (21회 대출)

자료유형
단행본
개인저자
Bowers, Michael Synodinos, Dionysios, 저 Sumner, Victor, 저 김지원, 역
서명 / 저자사항
(사전처럼 바로 찾아 쓰는) HTML5 + CSS3 디자인 패턴 : 레고처럼 조합하는 웹 디자인 패턴 / 미셸 바우어, 디오니시오스 시노디노스, 빅터 섬너 지음 ; 김지원 옮김
발행사항
서울 :   한빛미디어,   2013  
형태사항
640 p. : 삽화 ; 24 cm
원표제
Pro HTML and CSS3 design patterns
ISBN
9788968480065
일반주기
색인수록  
일반주제명
HTML (Document markup language) Web sites -- Design Cascading style sheets Web site development
000 01202camcc2200373 c 4500
001 000045780369
005 20131231194702
007 ta
008 130514s2013 ulka 001c kor
020 ▼a 9788968480065 ▼g 13000
035 ▼a (KERIS)BIB000013182589
040 ▼a 211014 ▼d 211009
041 1 ▼a kor ▼h eng
082 0 4 ▼a 006.7/4 ▼2 23
085 ▼a 006.74 ▼2 DDCK
090 ▼a 006.74 ▼b 2013z1
100 1 ▼a Bowers, Michael
245 2 0 ▼a (사전처럼 바로 찾아 쓰는) HTML5 + CSS3 디자인 패턴 : ▼b 레고처럼 조합하는 웹 디자인 패턴 / ▼d 미셸 바우어, ▼e 디오니시오스 시노디노스, ▼e 빅터 섬너 지음 ; ▼e 김지원 옮김
246 1 9 ▼a Pro HTML and CSS3 design patterns
260 ▼a 서울 : ▼b 한빛미디어, ▼c 2013
300 ▼a 640 p. : ▼b 삽화 ; ▼c 24 cm
500 ▼a 색인수록
650 0 ▼a HTML (Document markup language)
650 0 ▼a Web sites ▼x Design
650 0 ▼a Cascading style sheets
650 0 ▼a Web site development
700 1 ▼a Synodinos, Dionysios, ▼e
700 1 ▼a Sumner, Victor, ▼e
700 1 ▼a 김지원, ▼e
900 1 0 ▼a 바우어, 미셸, ▼e
900 1 0 ▼a 시노디노스, 디오니시오스, ▼e
900 1 0 ▼a 섬너, 빅터, ▼e
945 ▼a KLPA

소장정보

No. 소장처 청구기호 등록번호 도서상태 반납예정일 예약 서비스
No. 1 소장처 과학도서관/Sci-Info(1층서고)/ 청구기호 006.74 2013z1 등록번호 121227825 도서상태 대출가능 반납예정일 예약 서비스 B M

컨텐츠정보

책소개

HTML5와 CSS3를 활용해서 웹을 디자인할 수 있는 350여 가지의 디자인 패턴을 제시하는 책. 350여 가지 디자인 패턴을 사전식으로 구성해서 레퍼런스로 빠르게 찾아볼 수 있다. IE, 크롬, 파이어폭스, 오페라, 사파리 등 브라우저를 망라하여 데스크톱과 모바일에서 검증했다. 재사용과 모듈식 조합이 가능한 코드를 자세히 설명한다. 패턴에 직관적 이름을 붙여 패턴명을 만들고 이를 책의 각 절제목으로 구성하여 절제목만으로도 패턴의 기능을 정확하게 파악하며 쉽게 학습할 수 있도록 하였다.

이 책이 제시하는 핵심 내용
HTML5와 CSS3를 활용해서 웹을 디자인할 수 있는 350여 가지의 디자인 패턴을 제시한다. 디자이너, 개발자는 350여 가지 디자인 패턴을 활용해서 마치 레고 블록을 조립하듯 웹 페이지를 쉽게 디자인할 수 있다.

이 책의 특징과 장점 (책 소개)
-. 350여 가지 디자인 패턴을 사전식으로 구성해서 레퍼런스로 빠르게 찾아볼 수 있다.
-. IE, 크롬, 파이어폭스, 오페라, 사파리 등 브라우저를 망라하여 데스크톱과 모바일에서 검증했다.
-. 재사용과 모듈식 조합이 가능한 코드를 자세히 설명한다.
-. 패턴에 직관적 이름을 붙여 패턴명을 만들고 이를 책의 각 절제목으로 구성하였다. 따라서 독자는 절제목만으로도 패턴의 기능을 정확하게 파악하며 쉽게 학습할 수 있다.
-. 화면 캡처만 살펴보고도 필요한 해결책을 찾을 수 있는 간편한 문제 해결서다.

어떤 독자를 위한 책인가? (대상 독자)
-. HTML5, CSS3의 최신 웹 기술을 익히고자 하는 웹 퍼블리셔
-. HTML5, CSS3의 웹 기술을 사전식으로 일목 요연하게 정리한 책을 레퍼런스로 삼고자 하는 웹 디자이너, 개발자
-. CSS 기술을 더 높은 수준으로 향상시키고자 하는 현업의 웹 디자이너, 개발자 전문가 그룹


정보제공 : Aladin

저자소개

빅터 섬너(지은이)

룩스마트(looksmart Ltd.)의 수석 소프트웨어 엔지니어다. 웹 프로그램 개발자로서 데이터베이스 관리자에서부터 웹 디자이너에 이르기까지 웹 프로그램 수명주기 동안 다양한 역할을 맡았다. 독특하게도 빅터는 오랫동안 작업에 매달려 거슬리는 문제를 해결하는 과정을 즐긴다. 사무실 밖에서는 사진 촬영, 말 타기, 카지노 등 다양한 취미 활동을 즐긴다. 현재 부인 앨리샤(Alicia)와 캐나다 온타리오에 거주한다.

디오니시오스 시노디노스(지은이)

리치 인터넷 프로그램, 웹앱 보안, 모바일 웹, 웹 서비스를 주로 취급하는 프리랜서 컨설턴트 겸 C4Media의 리서치 플랫폼 담당 팀장이다. InfoQ에서 HTML5와 자바스크립트 수석 편집자로도 활동하며 JVM 플랫폼에 관해 정기적으로 글을 게재한다. 또한 10년 이상 서버 측 프로그래밍과 UI 설계를 넘나들면서 다양한 소프트웨어 프로젝트에 참여하고 각종 IT 간행물에 기고했다.

미셸 바우어(지은이)

지난 22년간 소프트웨어 서적을 전문적으로 집필해왔으며, 14세 때 프로그래밍을 독학한 후 지금까지 계속 이어가고 있다. 현재는 책임 엔지니어 겸 기업 정보 설계사다. 웹사이트에서부터 앱 프레임워크를 비롯해 데이터베이스 시스템에 이르기까지 무수한 프로젝트에 소프트웨어 개발자, 설계사, 모델 제작자로 참여했다. 또한 웹 프로그램 제작, 기업 시스템 통합, 로봇 공학을 이용한 공장 자동화, 언어/해석기/컴파일러 개발, 팀 관리 등 경력이 매우 폭넓고 다양하다. 주로 사용하는 언어는 CSS, HTML, XML, C#, C++, 비주얼베이직, 자바, 자바스크립트, SQL, 엑스쿼리 등이다. 피아노 연주에도 능하며 작곡 전공 학사 학위, 음악 이론 석사 학위도 보유했다. 여가 시간에는 즉흥 연주, 편곡, 작곡을 즐긴다.

김지원(옮긴이)

웹 기술뿐 아니라 온갖 분야에 발을 뻗고 싶어하는 바람기를 지녔지만 역부족이다. 배워야 할 것이 갈수록 늘어나 시간의 결핍을 느낀다. 기술 문서, 매뉴얼, 유비쿼터스 관련 논문을 번역한 바 있고 해외 논문 DB 구축에 필요한 관련 작업에도 참여했다. 『한 권으로 끝내는 정규표현식』(한빛미디어, 2010), 『웹 표준 가이드: HTML5+CSS3』(한빛미디어, 2010), 『프로젝트로 배우는 HTML5+자바스크립트』(한빛미디어, 2012), 『리팩토링』(한빛미디어, 2012), 『엘리멘틀 디자인 패턴』(한빛미디어, 2013) 등을 번역했다.

정보제공 : Aladin

목차

목차
옮긴이의 글 = 4
지은이의 글 = 7
지은이 소개 = 9
기술 감수자 소개 = 10
대상 독자 = 11
이책의 구성 = 12
이책의 활용 방법 = 15
감사의 글 = 16
CHAPTER 1 이것만 알면 쉬워지는 CSS 
 1-1. 체계적인 구성의 디자인 패턴 레시피 = 31
 1-2. 디자인 패턴 사용법 = 32
 1-3. 스타일시트 사용법 = 38
 1-4. CSS 문법 = 40
 1-5. 선택자 우선순위 = 47
 1-6. 우선순위 단순화 = 51
 1-7. HTML과 CSS 관련 링크 = 52
 1-8. 많이 쓰는 CSS 속성 = 53
 1-9. 모든 브라우저가 지원하는 CSS 속성과 값 = 54
 1-10. 내용을 위한 CSS 속성과 값 = 56
 1-11. 레이아웃을 위한 CSS 속성과 값 = 58
 1-12. 특정 요소에만 적용되는 CSS 속성과 값 = 59
 1-13. 선택자 = 60
 1-14. 미디어 쿼리 = 64
 1-15. 가변 크기 단위 = 66
 1-16. 고정 크기 단위 = 66
 1-17. 96dpi 화면의 크기 단위 환산표 = 67
 1-18. 96dpi 화면의 폰트 크기 단위 환산표 = 68
 1-19. 전환, 애니메이션, 2D 변형 = 69
 1-20. CSS 오류 해결하기 = 70
 1-21. 스타일시트 표준화 = 72
CHAPTER 2 HTML 디자인 패턴
 2-1. HTML 구조 = 78
 2-2. XHTML = 86
 2-3. DOCTYPE = 89
 2-4. 헤드 요소 = 92
 2-5. 조건부 스타일시트 = 95
 2-6. 구조 블록 요소 = 98
 2-7. 종결 블록 요소 = 101
 2-8. 다용도 블록 요소 = 103
 2-9. 인라인 요소 = 106
 2-10. 클래스 속성과 아이디 속성 = 109
 2-11. HTML 공백 = 112
CHAPTER 3 CSS 선택자와 상속
 3-1. 요소/클래스/아이디 선택자 = 116
 3-2. 위치/그룹 선택자 = 119
 3-3. 속성 선택자 = 122
 3-4. 가상 요소 선택자 = 124
 3-5. 가상 클래스 선택자 = 126
 3-6. 자손 클래스 선택자 = 129
 3-7. 상속 = 131
 3-8. 가짜 상속 = 133
CHAPTER 4 박스 모델
 4-1. 화면 표시 = 139
 4-2. 박스 모델 = 141
 4-3. 인라인 박스 = 143
 4-4. 인라인 블록 박스 = 146
 4-5. 블록 박스 = 148
 4-6. 테이블 박스 = 151
 4-7. 절대 위치 박스 = 153
 4-8. 플로트 박스 = 156
CHAPTER 5 박스 모델 크기
 5-1. 너비 = 160
 5-2. 높이 = 162
 5-3. 지정 크기 = 64
 5-4. 자동 축소 = 167
 5-5. 자동 확대 = 169
CHAPTER 6 박스 모델 속성
 6-1. 마진 = 174
 6-2. 테두리 = 176
 6-3. 패딩 = 179
 6-4. 배경 = 181
 6-5. 오버플로우 = 184
 6-6. 가시성 = 186
 6-7. 페이지 구분 = 188
CHAPTER 7 배치 모델
 7-1. 배치 모델 소개 = 192
 7-2. 배치 속성값 = 194
 7-3. 기준 요소 = 196
 7-4. 스택 콘텍스트 = 199
 7-5. 요소와 내용 묶기 = 202
 7-6. 정적 배치 = 204
 7-7. 절대 위치 = 207
 7-8. 고정 배치 = 209
 7-9. 상대 위치 = 212
 7-10. 플로트 지정과 해제 = 214
 7-11. 상대적 플로트 배치 = 217
CHAPTER 8 들여넣기, 간격 띄우기, 정렬하기
 8-1. 들여넣기 = 222
 8-2. 정적 요소 간격 띄우기 = 224
 8-3. 정적 테이블 간격 띄우기와 들여넣기 = 226
 8-4. 플로트 요소 간격 띄우기 = 229
 8-5. 절대 요소와 고정 요소 간격 띄우기 = 231
 8-6. 상대 요소 간격 띄우기 = 234
 8-7. 정적 인라인 요소 정렬 = 236
 8-8. 정적 블록 요소 정렬과 간격 띄우기 = 238
 8-9. 정적 테이블 정렬과 간격 띄우기 = 240
 8-10. 절대 요소 정렬과 간격 띄우기 = 243
 8-11. 절대 요소 중앙 정렬 = 246
 8-12. 외부 정렬 = 248
CHAPTER 9 고급 배치 기법
 9-1. 왼쪽 정렬 = 252
 9-2. 왼쪽 간격 띄우기 = 255
 9-3. 오른쪽 정렬 = 257
 9-4. 오른쪽 간격 띄우기 = 260
 9-5. 세로 중앙 정렬 = 262
 9-6. 중앙 간격 띄우기 = 265
 9-7. 상단 정렬 = 268
 9-8. 상단 간격 띄우기 = 271
 9-9. 하단 정렬 = 273
 9-10. 하단 간격 띄우기 = 276
 9-11. 가로 중앙 정렬 = 279
 9-12. 중앙 간격 띄우기 = 282
CHAPTER 10 글자 스타일 지정
 10-1. 폰트 = 286
 10-2. 형광펜 효과 = 289
 10-3. 글자 장식 = 291
 10-4. 글자 그림자 = 294
 10-5. 글자 대신 이미지 사용 = 296
 10-6. 캔버스와 VML로 글자 대체 = 298
 10-7. 폰트 삽입 = 300
 10-8. 글자 숨기기 = 302
 10-9. 스크린리더만 인식하는 글 = 304
CHAPTER 11 내용에 여백 넣기
 11-1. 여백 지정 = 308
 11-2. 인라인의 블록화 = 311
 11-3. 줄바꿈 방지 = 314
 11-4. 공백 유지 = 316
 11-5. 코드체 = 318
 11-6. 내용 패딩 = 321
 11-7. 인라인 여백 요소 = 324
 11-8. 인라인 장식 요소 = 327
 11-9. 줄바꿈 = 330
 11-10. 인라인 가로 구분선 = 333
CHAPTER 12 내용 정렬하기
 12-1. 들여쓰기 = 338
 12-2. 내어쓰기 = 340
 12-3. 내용 가로 정렬 = 342
 12-4. 내용 세로 정렬 = 344
 12-5. 내용 세로 간격 띄우기 = 346
 12-6. 위 첨자와 아래 첨자 = 349
 12-7. 정렬 콘텍스트 포개기 = 352
 12-8. 고급 정렬 예제 = 354
CHAPTER 13 블록
 13-1. 구조적 의미 = 358
 13-2. 구조 시각화 = 361
 13-3. 섹션 = 363
 13-4. 리스트 = 366
 13-5. 배경 불릿 = 369
 13-6. 블록의 인라인화 = 372
 13-7. 마진 병합 = 374
 13-8. 런인 = 377
 13-9. 블록 가로 구분선 = 380
 13-10. 블록 여백 요소 = 382
 13-11. 블록 여백 제거 요소 = 384
 13-12. 왼쪽 마진 = 386
 13-13. 오른쪽 마진 = 389
CHAPTER 14 이미지
 14-1. 이미지 = 394
 14-2. 이미지 맵 = 397
 14-3. 페이드아웃 = 399
 14-4. 반투명 효과 = 401
 14-5. 글자 대신 이미지 사용 = 404
 14-6. 이미지 위에 내용 표시 = 406
 14-7. 배경 이미지 위에 내용 표시 = 409
 14-8. CSS 스프라이트 = 411
 14-9. 이미지에 그림자 넣기 = 416
 14-10. 이미지에 그림자 넣기 응용 = 418
 14-11. 둥근 모서리 = 423
 14-12. 종합 예제: 이미지 = 427
CHAPTER 15 테이블
 15-1. 테이블 = 432
 15-2. 행 그룹과 열 그룹 = 434
 15-3. 테이블 선택자 = 437
 15-4. 테두리 분리 = 440
 15-5. 테두리 병합 = 443
 15-6. 병합 테두리 스타일 = 445
 15-7. 셀 감춤과 셀 삭제 = 448
 15-8. 행/열 감춤과 삭제 = 450
 15-9. 데이터 세로 정렬 = 453
 15-10. 줄무늬 테이블 = 455
 15-11. 일반 요소로 테이블/행/셀 표현 = 457
 15-12. 테이블 레이아웃 = 459
CHAPTER 16 테이블 열 레이아웃
 16-1. 열 너비 = 467
 16-2. 자동 축소 열 = 469
 16-3. 지정 크기 열 = 471
 16-4. 내용 비례 열 = 474
 16-5. 크기 비례 열 = 476
 16-6. 백분율 비례 열 = 479
 16-7. 반비례 열 = 481
 16-8. 자동 축소 균등 열 = 484
 16-9. 너비 등분 열 = 486
 16-10. 너비 미달 열 = 489
 16-11. 가변 너비 열 = 491
 16-12. 종합 예제 : 열 레이아웃 혼용 = 493
CHAPTER 17 각종 레이아웃 기법
 17-1. 유동 레이아웃 기초 = 499
 17-2. 내부 박스 = 501
 17-3. 플로트 섹션 = 507
 17-4. 플로트 구분선 = 509
 17-5. 유동 레이아웃 = 512
 17-6. 좌우 플로트 요소 = 514
 17-7. 이벤트 스타일 지정 = 517
 17-8. 롤업 = 520
 17-9. 탭 메뉴 = 523
 17-10. 탭 = 527
 17-11. 드롭다운 메뉴 = 532
 17-12. 버튼 = 537
 17-13. 레이아웃 링크 = 541
 17-14. 다단 레이아웃 = 544
 17-15. 템플릿 레이아웃 = 546
 17-16. 종합 예제 : 레이아웃 = 548
CHAPTER 18 드롭캡
 18-1. 정렬 드롭캡 = 554
 18-2. first-letter 드롭캡 = 556
 18-3. 내어쓰기 드롭캡 = 558
 18-4. 패딩 드롭캡 = 561
 18-5. 플로트 드롭캡 = 563
 18-6. 플로트 그림 드롭캡 = 566
 18-7. 마진 드롭캡 = 568
 18-8. 마진 그림 드롭캡 = 571
CHAPTER 19 콜아웃과 인용
 19-1. 왼쪽 플로트 콜아웃 = 576
 19-2. 오른쪽 플로트 콜아웃 = 578
 19-3. 중앙 콜아웃 = 581
 19-4. 왼쪽 마진 콜아웃 = 583
 19-5. 오른쪽 마진 콜아웃 = 585
 19-6. 블록 인용 = 588
 19-7. 인라인 블록 인용 = 591
 19-8. 인라인 인용 = 594
CHAPTER 20 경고
 20-1. 자바스크립트 경고창 = 598
 20-2. 툴팁 경고창 = 600
 20-3. 팝업 경고창 = 602
 20-4. 경고문 = 606
 20-5. 인라인 경고문 = 609
 20-6. 내어쓰기 경고문 = 612
 20-7. 그림 경고문 = 615
 20-8. 런인 경고문 = 618
 20-9. 플로트 경고문 = 620
 20-10. 왼쪽 마진 경고문 = 623
 20-11. 오른쪽 마진 경고문 = 626
 20-12. 폼 유효성 검사 경고문 = 629
INDEX = 631

관련분야 신착자료

National Academies of Sciences, Engineering, and Medicine (U.S.) (2020)
Cartwright, Hugh M. (2021)
한국소프트웨어기술인협회. 빅데이터전략연구소 (2021)