쉽고 빠르게 익히는 CSS3
도서+교보Only(교보배송)을 함께 15,000원 이상 구매 시 무료배송
15,000원 미만 시 2,500원 배송비 부과
20,000원 미만 시 2,500원 배송비 부과
15,000원 미만 시 2,500원 배송비 부과
1Box 기준 : 도서 10권
해외주문/바로드림/제휴사주문/업체배송건의 경우 1+1 증정상품이 발송되지 않습니다.
패키지
북카드
키워드 Pick
키워드 Pick 안내
관심 키워드를 주제로 다른 연관 도서를 다양하게 찾아 볼 수 있는 서비스로, 클릭 시 관심 키워드를 주제로 한 다양한 책으로 이동할 수 있습니다.
키워드는 최근 많이 찾는 순으로 정렬됩니다.
작가정보
저자(글) 제이슨 크랜포드 티그
저자 제이슨 크랜포드 티그(Jason Cranford Teague)는 디자이너이자 저자이며 사람들이 창조적으로 기술을 적용하게끔 도와주는 강연자이기도 하다. 제이슨은 버진, 웹 MD, 지멘스, 코카콜라, CNN, AOL, 메리어트, 뱅크 오브 아메리카를 비롯한 여러 고객을 대상으로 15년 이상 온라인 디자인 작업을 했다. 출간한 저서로는
번역 유윤선
역자 유윤선은 IT 프리랜서 번역가로 활동하고 있다. 역서로는 『어도비 AIR 인 액션』, 『액션스크립트 3.0 완벽 가이드』, 『시작하세요! 아이패드 프로그래밍』, 『쉽고 빠르게 익히는 CSS3』, 『플래시 빌더 4 & 플렉스 4 바이블』 등이 있으며, 현재 플래시, 자바, 모바일 프로그래밍 등 다양한 분야에 관심을 가지고 번역을 하고 있다. 개인 블로그를 운영하고 있다.
목차
- 01장 CSS 이해
스타일이란?
CSS란?
- CSS의 동작 방식
CSS의 발전 과정
- CSS 레벨 1 (CSS1)
- CSS 레벨 2 (CSS2)
- CSS 레벨 3 (CSS3)
CSS 규칙의 종류
CSS 규칙의 구성요소
- 브라우저의 CSS 확장 속성
CSS3의 새 기능
02장 HTML5 기초
HTML이란?
- 기본 HTML 문서 구조
- HTML 속성
- HTML과 CSS
HTML 엘리먼트의 종류
HTML5의 발전 과정
- 그런 다음 XHTML이 등장한다
- XHTML2의 문제점
- 그때 HTML5가 등장했다
- HTML5인가 XHTML5인가?
HTML5의 새 기능
HTML5 구조의 동작 원리
HTML5 구조 사용하기
- 인터넷 익스플로러에서의 HTML5 보완
03장 CSS 기초
기본 CSS 선택자
인라인 스타일 - HTML 태그 내의 스타일 추가
- 개별 HTML 태그 내에서의 스타일 속성 설정
페이지 내 스타일 - 웹 페이지에서의 스타일 추가
- HTML 문서 내에서의 태그 스타일 설정
외부 스타일 - 전체 웹 사이트 차원의 스타일 추가
- 외부 스타일 시트 생성
- 외부 CSS 파일의 설정
- 외부 CSS 파일 링크
- 스타일 시트 불러오기
- 외부 CSS 파일 불러오기
HTML 태그 (재)정의
- HTML 선택자 정의
재사용 가능한 클래스 정의
- 클래스 선택자 정의
고유 ID 정의
- ID 선택자 정의
- 공통 선택자의 적용
그룹 지정 - 동일 스타일을 사용하는 엘리먼트 정의
- 선택자 그룹 지정
CSS에 주석 추가
- 스타일 시트에서의 주석 추가
04장 선택적 스타일 적용
엘리먼트 가계도
문맥에 따른 스타일 정의
- 자손 엘리먼트의 스타일 적용
- 자손의 전체 스타일 적용
- 자식 엘리먼트에만 스타일 적용
- 형제 엘리먼트의 스타일 적용
- 인접 형제 선택자의 정의
의사 클래스의 사용
- 링크의 스타일 적용
- 서로 구분된 링크 스타일 설정
- 사용자 상호작용에 대한 스타일 적용
- 동적 의사 클래스의 정의
- CSS3의 새 기능 - 의사 클래스를 지닌 특정 자식에 대한 스타일 적용 ★
- 엘리먼트의 자식 스타일 적용
- 특정 언어에 대한 스타일 적용
- 특정 언어에 대한 스타일 설정
- CSS3의 새 기능 - 엘리먼트에 대한 스타일 부정 ★
- 특정 엘리먼트에 대한 스타일 부정
의사 엘리먼트의 사용
- 첫 글자 및 첫 줄 의사 엘리먼트의 사용
- 아티클의 시작 부분 강조
- 엘리먼트 전, 후 콘텐츠 설정
- 엘리먼트 전, 후 콘텐츠 추가
태그 어트리뷰트 기반 스타일 정의
- 엘리먼트 어트리뷰트를 기반으로 한 스타일 설정
CSS3의 새 기능 - 미디어 쿼리 ★
- 미디어 쿼리
- 미디어 쿼리를 사용한 스타일 지정
- @media 규칙 사용법
- @media를 사용한 스타일 지정
부모로부터의 속성 상속
- 기존 속성값과 상속한 속성값의 관리
!important 선언 지정
- 강제로 선언 적용하기
캐스케이딩 순서의 판단
- 엘리먼트의 캐스케이딩 우선순위 판단
05장 폰트 속성
웹 타이포그래피의 이해
- 캐릭터셋 지정
- 일반 폰트 패밀리
- 딩뱃
- HTML 캐릭터 엔티티
폰트 스택 설정
- 엘리먼트에 대한 폰트 패밀리 정의
폰트 선택
- 웹 안전 폰트
- 다운로드 가능한 웹폰트
- 더 나은 폰트 스택 설정
- 엘리먼트에 대한 웹 안전 폰트 또는 웹폰트 정의
폰트 크기 설정
- 엘리먼트의 폰트 크기 정의
CSS3 새 기능 - 대체 폰트의 크기 조절 ★
- 엘리먼트에 대한 폰트 크기 조절
텍스트의 이탤릭체 설정
- 엘리먼트의 폰트 스타일 설정
볼드체 설정
- CSS 규칙에서의 볼드 텍스트 정의
소형 대문자 설정
- 엘리먼트에 대한 소형 대문자 설정
여러 폰트 값 일괄 설정
- 단일 규칙 내에서의 여러 폰트 어트리뷰트 동시 정의
06장 텍스트 속성
텍스트 간격 조절
- 글자 사이의 간격 조절(트래킹)
- 자간 정의
- 단어 사이의 간격 조절
- 단어 사이의 간격 설정
- 텍스트 줄 간격 조절(행간)
- 리딩 정의하기
텍스트 대소문자 설정
- 텍스트 대소문자 정의
CSS3 새 기능 - 텍스트 드롭 섀도우 추가 ★
- 텍스트 섀도우 정의
텍스트 가로 정렬
- 텍스트 정렬 정의
텍스트 세로 정렬
- 세로 정렬 정의
단락 들여쓰기
- 텍스트 들여쓰기 정의
공백 제어
- 공백 간격 정의
텍스트 장식
- 텍스트 장식(장식 제거)
곧 추가될 기능
07장 색상과 배경 속성
색상값 선택
- 색상 키워드
- RGB 16진수 값
- RGB 10진수 값
- 퍼센트 값
- CSS3의 새 기능 - HSL 값 ★
- CSS3의 새 기능 - 색상 알파 값 ★
CSS3의 새 기능 - 배경색 그라디언트 ★
- 인터넷 익스플로러 그라디언트
- 모질라 그라디언트
- 웹킷 그라디언트
색상 팔레트 선택
- 온라인 색상 스키마 툴
텍스트 색상 설정
- 텍스트 색상 정의하기
배경색 설정
- 엘리먼트의 배경색 정의
- 배경 이미지 정의
배경 단축 속성 활용
- 배경 정의
08장 리스트와 테이블 속성
불릿 스타일 설정
- 불릿 스타일 정의
커스텀 불릿 생성
- 커스텀 그래픽 불릿 정의
불릿 위치 설정
- 리스트 항목에서 줄바꿈 텍스트의 줄 위치 정의
여러 리스트 스타일 설정
- 여러 리스트 스타일 속성 정의
테이블 레이아웃 설정
- 테이블 레이아웃 설정
테이블 셀 사이 간격 설정
테이블 셀 사이의 보더 병합
- 테이블 보더 병합
테이블 설명 위치 설정
09장 사용자 인터페이스 및 동적 생성 콘텐츠 속성
마우스 포인터의 모양 수정
CSS를 사용한 콘텐츠 추가
카운터 적용 방식 지정
인용 스타일 지정
10장 박스 속성
엘리먼트 박스의 이해
- 박스의 구성요소
엘리먼트 보여주기
엘리먼트의 너비 및 높이 설정
- 엘리먼트의 너비 정의
- 엘리먼트의 높이 정의
- 최대 및 최소 너비 설정
콘텐츠 오버플로우 제어
- 오버플로우 제어 정의
창 내에서의 플로팅 엘리먼트
- 플로팅 엘리먼트 제거
- 엘리먼트 플로팅 방지
엘리먼트 마진 설정
- 엘리먼트의 마진 정의
엘리먼트의 외곽선 설정
- 박스 외곽선 설정
엘리먼트 보더 설정
- 보더 설정
CSS3의 새 기능 - 보더 모서리 둥글게 만들기 ★
- 둥근 모서리 설정
CSS3의 새 기능 - 보더 이미지 설정 ★
- 보더 배경 이미지 설정
엘리먼트 패딩 설정
- 패딩 설정
곧 추가될 기능
11장 시각 형태 속성
창과 문서 이해
위치 타입 설정
- 정적 위치 지정
- 상대 위치 지정
- 절대 위치 지정
- 고정 위치 지정
엘리먼트의 위치 설정
객체의 3D 스택
엘리먼트의 가시성 설정
엘리먼트의 가시 영역 잘라내기
CSS3의 새 기능 - 엘리먼트의 불투명도 설정 ★
- 엘리먼트의 불투명도 설정
CSS3의 새 기능 - 엘리먼트 섀도우 설정 ★
- 엘리먼트 섀도우 설정
12장 변형 및 트랜지션 속성
CSS3의 새 기능 - 엘리먼트 변형 ★
- 2D 변형
- 3D 변형
CSS3의 새 기능 - 엘리먼트 상태 간의 트랜지션 추가 ★
- 어떤 것을 트랜지션할 수 있나?
13장 CSS 문제 해결
인터넷 익스플로러 관련 CSS 조정
- 밑줄 핵
인터넷 익스플로러 박스 모델 문제 해결
CSS 리셋
- 간단한 CSS 리셋
- YUI2: 리셋 CSS
- 에릭 메이어의 리셋
플로팅 문제 해결
- 줄바꿈 태그를 사용하면 모든 문제가 해결된다
- 오버플로우 해결책
14장 핵심 CSS 기법
플로팅을 사용한 멀티컬럼 레이아웃 생성
- CSS를 사용한 멀티컬럼 레이아웃 설정
링크 스타일과 내비게이션
- 내비게이션과 링크에 스타일 적용
CSS 스프라이트의 사용
- CSS 이미지 롤오버 추가
CSS 드롭다운 메뉴 생성
- 순수 CSS 드롭다운 메뉴 만들기
15장 스타일 시트 관리
읽기 쉬운 스타일 시트 작성
- 소개 및 목차를 작성한다
- 색상, 폰트, 기타 상수를 정의한다
- @rule을 상단에 둔다
- 조직 스키마를 선택한다
- CSS 구체성을 활용한 계층구조 적용
CSS 라이브러리와 프레임워크
스타일 시트 전략
- 전체 통합 방식
- 분할 정복 방식
- 합체 방식
- 동적 방식
CSS 코드 문제 해결
- 다음과 같은 질문을 자문해보자
- 여기까지 했는데도 여전히 문제가 해결되지 않는다면 다음과 같은 방법을 시도해 보자
파이어버그와 웹 인스펙터를 활용한 CSS 디버깅
- 파이어폭스의 파이어버그
- 파이어버그 시작하기
- 사파리와 크롬의 웹 인스펙터
- 웹 인스펙터 시작하기
CSS 코드의 유효성 검증
- W3C의 CSS 유효성 검증기 활용
CSS 최소화
- CSS 최소화
32가지 모범 개발 방식
부록A CSS 빠른 참조표
기본 선택자
의사 클래스
의사 엘리먼트
텍스트 속성
폰트 속성
색상 및 배경 속성
리스트 속성
테이블 속성
UI 및 동적 콘텐츠 속성
박스 속성
시각 형태 속성
변형 속성 (-webkit-, -moz-, -o-)
트랜지션 속성 (-webkit-, -moz-, -o-)
부록B HTML과 UTF 문자 인코딩
HTML과 UTF 문자 인코딩
책 속으로
이 책은 CSS3를 스타일 있게 배울 수 있는 최고의 지침서다. 한눈에 들어오는 편집과 직관적이고 군더더기 없는 설명, 디자이너의 눈높이에 맞춘 쉬운 표현으로 CSS3의 맥을 잘 짚어준다. 이 책을 읽다 보면 옆에서 CSS3의 대가가 그림을 그려 가면서 CSS3를 설명해주는 듯한 느낌을 받는다. 단순히 책을 빠르게 훑어보는 것만으로도 CSS3를 이해할 수 있을 정도로 책의 요소 요소마다 핵심을 잘 정리한 책이다. 최신 버전인 CSS3뿐 아니라 CSS에 대한 이해의 폭을 넓히고 체계적인 지식을 쌓으려는 독자에게 좋은 가이드가 될 것이다.
CSS를 말 그대로 ‘잘’ 구현하기란 생각보다 쉽지 않다. 물론 지원할 브라우저가 하나뿐이라면 CSS 디자인이 조금 덜 어렵겠지만, 그렇다 하더라도 고려해야 할 요소가 여전히 많다. 이전 브라우저 버전과의 호환성, 인쇄용 페이지에 사용할 스타일, 다른 기기(휴대용 기기)에 대한 스타일 지원 등은 이런 여러 고려 사항 중 하나일 뿐이다. 이 책에서는 CSS 디자이너가 이런 문제들을 해결할 때 직접적인 도움을 줄 수 있는 여러 자료를 제공한다. 일례로 새로운 CSS 속성이 나올 때마다 속성을 표로 정리해 CSS 호환성을 보여준다. 독자들은 이 표만 가지고도 디자인 대상이 되는 브라우저에서 해당 스타일을 쓸 수 있는지 여부를 쉽게 판단할 수 있다. 또 두세 페이지에 걸쳐 한 번 꼴로 등장하는 저자의 팁은 CSS 디자이너들이 더 나은 디자인을 하기 위해 참고해야 할 내용으로 가득 차 있다.
이 책은 CSS3뿐 아니라 CSS를 전반적으로 다루는 책이다. 이 책은 단순히 CSS를 설명하는 데 그치는 것이 아니라 어떻게 하면 CSS를 더 잘 활용할 수 있고 어떻게 하면 디자이너들이 좀 더 쉽게 CSS를 ‘잘’ 구현할 수 있는지 오랫동안 고민한 저자의 흔적을 여실히 보여준다. CSS 디자이너이자 책의 저자로 오랫동안 활약한 저자의 경험에서 우러나온 팁과 혜안은 새로운 CSS 지식을 배우는 것보다 더 큰 자산을 이 책의 독자에게 물려줄 것이다. 이 책을 통해 CSS3를 어려워하는 디자이너들이 좀 더 쉽고 편하게 CSS3를 배울 수 있게 되기를 바란다.
★ 이 책의 대상 독자 ★
이 책은 CSS 디자이너와 웹 개발자를 위한 책이다. HTML을 잘 알고 있는 CSS 디자이너라면 더욱 좋겠지만, HTML을 몰라도 책의 내용을 이해하는 데는 아무런 문제가 없다. 이 책은 CSS3뿐 아니라 CSS 전반을 다루므로 CSS를 처음 시작하는 디자이너가 CSS를 처음부터 배우기에도 적합하며, 웹 개발자가 CSS를 배우는 용도로도 적합하다. CSS3를 배우려고 하는 기존 웹 디자이너, CSS를 처음 접하는 웹 디자이너, 새로운 웹 환경에 맞는 최신 CSS 지식을 익히고자 하는 웹 개발자 모두에게 이 책을 추천한다.
- 옮긴이의 글 중에서
출판사 서평
쉽고 빠르게 익히는 CSS3!
★ 이 책의 특징 ★
■ CSS3의 새로운 기능을 그림을 통해 쉽게 이해하고 CSS3 적용 방법을 차근차근 단계적으로 배운다.
■ 간결한 절차와 설명을 따라 하다 보면 금세 CSS3를 적용할 수 있다.
■ 늘 옆에 두고 참고할 만한 핵심적인 설명으로 가득하다.
■ CSS 초보자와 전문가를 대상으로 CSS3의 가장 중요한 새로운 기능부터 타이포그래피, 색상, 이미지, 레이아웃 등과 관련한 모범 디자인 원칙에 이르기까지 두루두루 설명한다.
기본정보
ISBN | 9788992939713 | ||
---|---|---|---|
발행(출시)일자 | 2011년 04월 16일 | ||
쪽수 | 456쪽 | ||
크기 |
188 * 240
* 30
mm
/ 860 g
|
||
총권수 | 1권 | ||
시리즈명 |
위키북스 오픈소스 웹 시리즈
|
||
원서명/저자명 | CSS3 visual quickstart guide/Teague, Jason Cranford |
Klover
e교환권은 적립 일로부터 180일 동안 사용 가능합니다.
리워드는 작성 후 다음 날 제공되며, 발송 전 작성 시 발송 완료 후 익일 제공됩니다.
리워드는 리뷰 종류별로 구매한 아이디당 한 상품에 최초 1회 작성 건들에 대해서만 제공됩니다.
판매가 1,000원 미만 도서의 경우 리워드 지급 대상에서 제외됩니다.
일부 타인의 권리를 침해하거나 불편을 끼치는 것을 방지하기 위해 아래에 해당하는 Klover 리뷰는 별도의 통보 없이 삭제될 수 있습니다.
- 도서나 타인에 대해 근거 없이 비방을 하거나 타인의 명예를 훼손할 수 있는 리뷰
- 도서와 무관한 내용의 리뷰
- 인신공격이나 욕설, 비속어, 혐오발언이 개재된 리뷰
- 의성어나 의태어 등 내용의 의미가 없는 리뷰
리뷰는 1인이 중복으로 작성하실 수는 있지만, 평점계산은 가장 최근에 남긴 1건의 리뷰만 반영됩니다.
구매 후 리뷰 작성 시, e교환권 200원 적립
문장수집
e교환권은 적립 일로부터 180일 동안 사용 가능합니다. 리워드는 작성 후 다음 날 제공되며, 발송 전 작성 시 발송 완료 후 익일 제공됩니다.
리워드는 한 상품에 최초 1회만 제공됩니다.
주문취소/반품/절판/품절 시 리워드 대상에서 제외됩니다.
구매 후 리뷰 작성 시, e교환권 100원 적립