교재 DO It! HTML5+CSS3 웹표준의 정석
[^1]
[^1]: 이지스퍼블리싱 출판사 이미지 링크 연결.
출간일 : 2013년 09월 27일
저자 : 고경희^2
네이버카페 : cafe.naver.com/doithtml5
출판사 : 이지스퍼블리싱
목차
첫째마당
기초 태그부터 시작하는 HTML5의 모든 것
01장 HTML 기본 다지기
01-1 웹, HTML 이해하기
01-2 왜 HTML과 CSS를 배워야 할까?
01-3 웹 표준은 무엇인가?
01-4 실습 준비하기
[직접] 무료 편집기 노트패트++ 설치하기
[직접] 책에 있는 실습과정 준비하기
[직접] 닷홈에 무료 호스팅 서비스 신청하기
[직접] 무료 FTP 프로그램 FileZilla 설치하기
01-5 처음 만드는 HTML 문서
[직접] 기본 구조의 HTML 문서 만들기
[직접] 내가 만든 문서 웹 서버에 올리고 확인하기
01-6 HTML 문서의 구조
01-7 자주 쓰는 기본 태그 익히기
01-8 이 사이트는 어떻게 만든 거지? - 개발자 도구
[Special 01] 블로그와 게시판에서 사용하는 HTML
[Special 02] 네이버 편집기에서 HTML 태그 연습해 보기
02장 HTML5와 시맨틱 태그
02-1 HTML5의 문서 구조
02-2 레이아웃을 위한 HTML5 시맨틱 태그들
02-3 웹 브라우저 버전 고려하기
03장 텍스트와 하이퍼링크 관련 태그들
03-1 텍스트를 묶어서 처리하는 태그들
03-2 다양한 텍스트 관련 태그들
03-3 목록을 만드는 태그들
[직접] 다양한 텍스트 태그 연습하기
03-4 표 관련 태그들
03-5 원하는 곳으로 연결해주는 하이퍼링크
04장 멀티미디어를 다루는 태그들
04-1 HTML5와 이미지
[Special 03] 이미지 맵으로 이벤트 페이지 만들기
04-2 이미지 파일에 캡션 붙이기
[직접] 웹 문서에 이미지 파일 넣기
04-3 멀티미디어 재생하기
[직접] 비디오 파일 변환하기
[직접] 웹 문서에 비디오 파일 넣기
[Special 04] 블로그에 유튜브 동영상 넣기
05장 폼과 관련된 태그들
05-1 폼 만들기
05-2 사용자가 정보를 입력하는 태그
05-3 태그의 다양한 속성
[직접] 상품 주문서 만들기1- 마크업 작성하기
[직접] 상품 주문서 만들기2- CSS 적용하기
05-4 여러 데이터 나열해서 보여주기
05-5 기타 다양한 폼 요소들
둘째마당
CSS로 완성하는 웹 표준 사이트
06장 스타일시트 기초
06-1 웹 디자인을 실현해 주는 CSS
06-2 스타일의 우선순위
06-3 선택자
06-4 속성 선택자
06-5 가상 클래스
06-6 다양한 효과를 만들어내는 CSS3
07장 텍스트 관련 스타일
07-1 글꼴 관련 스타일
07-2 텍스트 스타일
07-3 텍스트 간격을 조절하는 스타일
[직접] 텍스트 스타일을 이용해 문서 정리하기
07-4 목록 스타일
[직접] 목록 스타일을 이용해 문서 정리하기
08장 색상과 배경을 위한 스타일
08-1 색상과 관련된 스타일
08-2 배경색과 배경 이미지
[직접] 제목에 배경 이미지 사용하기
[직접] 배경색과 배경 이미지 채우기
08-3 그러데이션 효과로 배경 꾸미기
[Special 05] 티스토리 블로그에서 스킨 바꾸기
09장 레이아웃을 위한 스타일
09-1 박스 모델
09-2 테두리 관련 속성들
09-3 CSS3 박스 관련 속성들
[직접] 박스 모델로 콘텐츠 정리하기
09-4 배치와 관련된 블록 레벨과 인라인 레벨
09-5 여러 요소를 원하는 형태로 배치하기
[직접] 포지셔닝을 이용해 타일 형식으로 배치하기
09-6 다단으로 편집하기
[직접] 웹 문서 3단 편집하기
09-7 표 관련 스타일
10장 변형(transform)을 위한 스타일
10-1 변형(transtorm)
[직접] 변형을 이용해 그림 강조하기
10-2 변형과 관련된 속성들
10-3 시간에 따른 변화를 만들어 주는 트랜지션
10-4 애니메이션 속성
[직접] 트랜지션을 이용해 내용 강조하기
[Special 06] CSS로 다양한 사진 효과 만들기
[Special 07] 드롭다운 내비게이션 만들기
셋째마당
PC, 태블릿, 스마트폰용 웹사이트를 한 번에 만든다
반응형 웹사이트 만들기
11장 반응형 웹 디자인과 미디어 쿼리
11-1 자유자재로 변하는 반응형 웹 디자인
11-2 반응형 웹을 실현시켜주는 미디어 쿼리
11-3 미디어 쿼리를 적용하기
[직접] PC용 미디어 쿼리 작성하기
[직접] 스마트폰용으로 미디어 쿼리 작성하기
12장 반응형 웹을 만드는 또 다른 방법, 유동형 레이아웃
12-1 유동형 레이아웃
12-2 유동형 레이아웃 만들기
[직접] CSS로 유동형 레이아웃 구성하기
12-3 유동형 이미지와 비디오
13장 그리드 레이아웃으로 웹사이트 제작하기
13-1 반응형 웹사이트 만들기
[Special 08] 최신 웹 기술, HTML5+자바스크립트+API
동영상 강좌
http://www.youtube.com/user/easyspub 에서 확인할 수 있다.
- Do it! HTML5+CSS3 웹표준의 정석-01강 : 왜 html과 css를 공부해야 할까
- Do it! HTML5+CSS3 웹표준의 정석-02강 : html5 시맨틱 태그
- Do it! HTML5+CSS3 웹표준의 정석-03강 : 시맨틱 태그로 웹표준에 맞는 문서 만들기
- Do it! HTML5+CSS3 웹표준의 정석-04강 : IE를 고려한 시맨틱 태그
- Do it! HTML5+CSS3 웹표준의 정석-05강 : 텍스트 관련 태그들
- Do it! HTML5+CSS3 웹표준의 정석-06강 : 목록과 텍스트 태그 연습하기
- Do it! HTML5+CSS3 웹표준의 정석-07강 : 하이퍼링크를 만드는 태그
- Do it! HTML5+CSS3 웹표준의 정석-08강 : HTML5와 이미지
- Do it! HTML5+CSS3 웹표준의 정석-09강 : 이미지 맵으로 이벤트 페이지 만들기
- Do it! HTML5+CSS3 웹표준의 정석-10강 : HTML5와 멀티미디어
- Do it! HTML5+CSS3 웹표준의 정석-11강 : 다양한 input 태그
- Do it! HTML5+CSS3 웹표준의 정석-12강 : input 태그의 속성
- Do it! HTML5+CSS3 웹표준의 정석-13강 : 상품 주문서 만들기
- Do it! HTML5+CSS3 웹표준의 정석-14강 : CSS기초
- Do it! HTML5+CSS3 웹표준의 정석-15강 : 텍스트 관련 스타일
- Do it! HTML5+CSS3 웹표준의 정석-16강 : 텍스트 관련 스타일
- Do it! HTML5+CSS3 웹표준의 정석-17강 : 색상과 배경 스타일
- Do it! HTML5+CSS3 웹표준의 정석-18강 : 그라데이션 효과와 배경 꾸미기
- Do it! HTML5+CSS3 웹표준의 정석-19강 : 박스모델이란
- Do it! HTML5+CSS3 웹표준의 정석-20강 : 박스 모델의 테두리 관련 속성들
- Do it! HTML5+CSS3 웹표준의 정석-21강 : 블록 레벨 요소와 인라인 레벨 요소
- Do it! HTML5+CSS3 웹표준의 정석-22강 : 포지셔닝
- Do it! HTML5+CSS3 웹표준의 정석-23강 : 다단으로 편집하기
- Do it! HTML5+CSS3 웹표준의 정석-24강 : 변경을 위한 스타일
- Do it! HTML5+CSS3 웹표준의 정석-25강 : 애니메이션을 위한 스타일
- Do it! HTML5+CSS3 웹표준의 정석-26강 : CSS로 다양한 사진효과 만들기
- Do it! HTML5+CSS3 웹표준의 정석-27강 : 드롭다운 메뉴 만들기
- Do it! HTML5+CSS3 웹표준의 정석-28강 : 반응형 웹디자인&미디어쿼리1
- Do it! HTML5+CSS3 웹표준의 정석-29강 : 반응형 웹디자인&미디어쿼리2
- Do it! HTML5+CSS3 웹표준의 정석-30강 : 유동형 레이아웃
자료실
- Do it! HTML5+CSS3 웹표준의 정석 - Sample.zip (예제 파일)
- Do it! HTML5+CSS3 웹표준의 정석 - HTML실습.zip (직접해보세요 파일)
- Do it! HTML5+CSS3 웹표준의 정석 - Specials.zip (스페셜 코너 파일)
- Do it! HTML5+CSS3 웹표준의 정석 - 연습문제.zip (도전 Mission 파일)
'WebDev > HTML5' 카테고리의 다른 글
HTML5 준비하기 (0) | 2012.12.30 |
---|---|
HTML5 관련 참고 사이트 (0) | 2012.12.24 |
댓글