실전 프로젝트를 통하여 반응형 웹사이트를 직접 구현해 본다!

이 책은 ‘웹 표준이라는 약속’에 대한 이야기를 바탕으로, 누구나 쉽게 단계적으로 따라갈 수 있도록 HTML5, CSS3, Javascript와 jQuery까지 표준형 웹 제작을 위한 모든 도구들을 기본부터 활용까지 리드하도록 만들어졌습니다.

누구나 쉽게 웹 표준에 맞는 페이지를 제작할 수 있도록 도구들의 기본부터 활용까지 다루되, PC와 스마트폰, 태블릿 등 사용자의 기기에 따라 유연하게 구현되는 차세대 웹 기술 ‘반응형 웹’을 소재로 하여 가장 최근에 이슈화되는 소재를 통하여 직접 웹 페이지를 제작하는 모든 독자분들께 실제적인 도움을 줍니다.

EIT 웹 개발 총괄, 삼성인재개발원 차장을 역임하였으며, 주요 저서로는 실전프로젝트 반응형 웹퍼블리싱, 자바스크립트+jQuery 마스터 등이 있다.

머리말
실습에 필요한 기본 프로그램 안내
반응형 프로젝트 미리보기

CHAPTER 1 HTML5
1.1 HTML5 기본 문서
01 HTML5 기본 구성
02 W3C validator
03 마크업 기본 문법 규칙
1.2 시멘틱 마크업과 논리적인 순서 마크업
01 시멘틱 마크업(Semantic markup)
02 논리적 순서 마크업(Logical sequence markup)
1.3 블록 레벨 요소와 인라인요소
01 블록 레벨 요소(Block-level Elements)
02 인라인 요소(inline Element)
03 블록 레벨 요소와 인라인 요소의 특성
1.4 기본 요소
01 제목 [h1]~[h6]
02 문단 [p]
03 주소 [address]
04 링크 [a]
05 이미지 [img]
1.5 텍스트 관련 요소
01 [em],[strong],[mark],[b],[small],[sub],[sup]
1.6 목록 관련 요소
01 순서 목록 [ol]
02 비순서 목록 [ul]
03 설명 목록 [dl]
1.7 표 관련 요소 및 속성
01 표 생성 [table], [tr], [td], [th], [thead], [tbody], [tfoot], [colgroup]
02 셀 합치기 colspan 속성, rowspan 속성
03 표 접근성 [caption], scope 속성
1.8 폼 관련 요소 및 주요 속성
01 폼 [form], [fieldset]
02 한줄 입력 요소 [input], type 속성
03 여러 줄 입력 요소, 선택 요소 [textarea], [select]
04 폼 접근성 label 속성
05 주요 입력 속성
1.9 그룹 요소
01 [div]
02 [span]
1.10 구조 관련 요소
01 [header], [section], [footer], [nav], [article], [aside]
1.11 미디어 요소
01 [audio]
02 [video]

CHAPTER 2 CSS (CSS5)
2.1 CSS 기본 문법
01 내부 스타일시트
02 외부 스타일시트
03 @import
04 인라인 스타일(inline style)
2.2 선택자(selector)
01 type 선택자
02 id 선택자
03 class 선택자
04 전체 선택자
05 하위 선택자
06 자식 선택자
07 인접 선택자
08 형제 선택자
09 그룹 선택자
10 속성 선택자
11 가상클래스 선택자
12 가상요소 선택자
13 종속 선택자
14 선택자의 우선순위
2.3 문자 관련 스타일
01 font-family
02 font-size, 단위의 고찰
03 font-weight
04 font-style
05 font-variant
06 line-height
07 font
08 웹폰트
09 color, 색상 코드 고찰
10 letter-spacing, word-spacing
11 text-decoration
12 text-transform
13 text-shadow
2.4 문단(paragraph) 관련 스타일
01 text-align
02 vertical-align
03 text-indent
04 word-wrap
05 word-break
06 white-space
07 text-overflow
08 display
09 visibility
10 overflow
11 opacity
2.5 배경(background)
01 background-color
02 background-image
03 background-repeat
04 background-position
05 background-attachment
06 background-size
07 background-origin
08 background-clip
09 Image Sprite
10 배경에 gradient 적용하기
11 multiple background
2.6 BOX MODEL
01 width, height
02 padding
03 margin
04 border
05 outline
06 box-sizing
07 box-shadow
08 resize
09 appearance
2.7 기타 CSS3 속성
01 이차원 변형(2D transform)
02 속성전환(transitions)
03 애니메이션(animation)
04 다단편집(multi-column)
2.8 레이아웃Ⅰ: float
01 float
02 clear
03 그 외 float 해제하는 몇 가지 방법
2.9 레이아웃Ⅱ : position
01 position
02 left, right, top, bottom
03 z-index
04 float과 position으로 레이아웃 만들기
05 position 응용 예제
2.10 미디어쿼리(media query)
01 [link ~ media=””]
02 @media
03 media query를 흉내내는 script
2.11 그 밖의 layout
01 flex layout
02 grid layout

CHAPTER 3 자바스크립트
3.1 자바스크립트 기본 형식 및 적용 방법
01 자바스크립트의 기본 형식
02 기본