명품 HTML5+CSS3+Javascript 웹 프로그래밍 - 개정판

Chapter 01 웹 프로그래밍과 HTML5 개요
1. 웹 개요
웹의 기본 목적과 구성
인터넷과 웹은 다르다
웹 브라우저
웹 서버와 웹 사이트
웹 문서와 전자 문서의 차이
웹 페이지의 주소, URL
웹 브라우저와 웹 서버 사이의 통신, HTTP
2. 웹의 시작과 성공
웹의 시작
웹의 성공
모든 곳에 웹이 있다
3. 웹 페이지 구성
웹 페이지 구성 3요소
3요소를 분리하여 웹 페이지 개발
HTML, CSS, Javascript
HTML, CSS, Javascript로 분리된 웹 페이지 만들기
4. HTML5
HTML 언어의 역사
HTML5의 출현 배경
HTML5 표준과 의의
HTML5의 기능
5. HTML5 웹 프로그래밍 개발 과정
HTML5 문서 편집
검증(validation)
디버깅
요약 01
Open Challenge 01
연습문제

Chapter 02 HTML5 기본 문서 만들기
1. HTML5 개요
HTML 페이지 기본
HTML 태그
2. HTML 기본 문서 만들기
타이틀 달기, <title>
문단 제목(장, 절, 소제목 등) 달기, <h1>, <h6>
툴팁 달기, title 속성
단락 나누기, <p>
수평선 긋기, <hr>
새로운 줄로 넘어가기, <br>
문자, 기호, 심볼 입력
개발자 포맷 그대로 출력하기, <pre>
텍스트 꾸미기
블록 태그와 인라인 태그
HTML 메타 데이터 삽입
3. 고급 문서 만들기
이미지 삽입, <img>
리스트 만들기, <ol>, <ul>, <dl>
표 만들기, <table>
4. 하이퍼링크와 항해
하이퍼링크 만들기, <a>
id 속성으로 앵커 만들기
파일 다운로드 링크 만들기, <a>의 download 속성
5. 인라인 프레임
인라인 프레임 만들기, <iframe>
인라인 프레임 윈도우의 이름
브라우저 윈도우와 인라인 프레임 윈도우의 계층 관계
target 속성에 문서를 출력할 윈도우 지정
6. 미디어 삽입
미디어의 표준화, <audio>, <video>
비디오 삽입, <video>
오디오 삽입, <audio>
요약 02
Open Challenge 02
연습문제

Chapter 03 HTML5 문서 구조화와 웹 폼
1. HTML5의 문서 구조화
문서의 구조
기존 HTML의 한계
검색 엔진이 좋아하는 웹 페이지, 시맨틱 웹
HTML5 문서의 구조와 시맨틱 태그
문서의 모양은 구조와 별개
HTML5 문서 구조화 사례
기존 HTML 문서와 HTML5 문서 비교
HTML5 문서 구조화 연습
시맨틱 블록 태그
시맨틱 인라인 태그
2. 웹 폼
웹 폼과 폼 요소
간단한 로그인 폼 만들기
폼 태그, <form>
네이버 검색 사례를 통한 폼 전송 과정의 이해
3. 폼 만들기
텍스트 입력, <input type=“text|password”>, <textarea>
데이터 목록을 가진 텍스트 입력 창, <datalist>
텍스트/이미지 버튼 만들기
선택형 입력
<label>로 폼 요소의 캡션 만들기
색 입력, <input type="color">
시간 정보 입력
스핀버튼과 슬라이드바로 편리한 숫자 입력
입력할 정보의 힌트 보여주기
형식을 가진 텍스트 입력
폼 요소들의 그룹핑, <fieldset>
요약 03
Open Challenge 03
연습문제

Chapter 04 CSS3로 웹 페이지 꾸미기
1. CSS3 스타일 시트 개요
CSS3
CSS3 맛보기 예제
CSS3 스타일 시트 구성
2. CSS3 스타일 시트 만들기
<style> 태그로 스타일 시트 만들기
style 속성에 스타일 시트 만들기
외부 스타일 시트 파일 불러오기
CSS3 규칙
3. 셀렉터
태그 이름 셀렉터
class 셀렉터
id 셀렉터
셀렉터 조합하기
전체 셀렉터
속성 셀렉터
가상 클래스 셀렉터
4. 색과 텍스트 꾸미기
색
텍스트
CSS3의 표준 단위
폰트
5. 박스 모델
HTML 태그는 사각형 박스로 다루어진다