일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- queue
- jest
- 호키스
- IOS
- SWIFT
- 자스민
- 자바스크립트
- 리액트 예제
- 계명대
- 개발자
- react
- 비동기
- Svelte
- data structure
- 이종호
- 리액트
- 자바스크립트 자료구조
- javascript
- 계명대 이종호
- HTML
- 힛잇
- 자료구조
- TDD
- Hitit
- 호키도키
- hokidoki
- 개발
- hokeys
- 스위프트
- 스벨트
- Today
- Total
Dog foot print
[css] 전문가를 위한 CSS3 리뷰 본문
이 책을 구매할 당시는 2018년 한참 css와 바닐라 js로 여러가지 토이프로그램을 만들며 실험하던 참이였다. 그러던 중 집에 쟁여놓고 사용할 만한 좋은 css 예제 책이 필요했는데 생각보다 최신 css관련 서적이 없고 내용도 html + css + javascript 섞어 놓은 책이나 초급용 책들이 대부분 이였다. 2년 넘은 책은 구입하지말라고 했었는데 마땅히 성에 차는 구성이 없으니 당시 발매한지 4년된 책을 구입하였다.
그게 바로 전문가를 위한 css3이다.
책에 대한 정보를 작게나마 요약하자면 다음과 같다.
저자 : 스테판 그레이그 (웹 개발자 겸 디자이너 http://tangledindesign.com/page/2/) 저자 블로그인데 2015년이 마지막 게시글이다.
발행사 : 비제이 퍼블릭
대상 : 중고급이상
목차
1부. 새로운 기능
1장. 고급 선택자
--자식과 형제 선택자
--속성 선택자
--의사-클래스
--통합 예제
--요약
--참고 자료
2장. 문자를 위한 새로운 툴
--문자 제대로 꾸미기
--글쓰기 방식
--시각적인 효과가 전체의 반이다
--요약
--참고 자료
3장. 배경과 보더를 위한 새로운 툴
--CSS3의 뛰어난 배경 제어 능력
--다수의 배경 이미지 활용
--보더를 위한 새로운 툴
--그라디언트
--요약
--참고 자료
4장. CSS 필터와 블렌딩 모드를 적용한 브라우저
--CSS3 필터
--블렌딩 모드
--요약
--참고 자료
2부. 전환, 전이, 그리고 애니메이션
5장. CSS3 2D 전환
--transform 속성
--전환 원점
--전환을 복합적으로 결합하기
--브라우저 지원 상황
--요약
--참고 자료
6장. 전이 기능으로 2D 전환에 생동감 부여하기
--CSS 전이 소개
--전이 활용
--전이와 2D 전환의 결합
--흩어져 있는 구조의 이미지 갤러리 만들기
--요약
--참고 자료
7장. 3D 전환으로 열리는 새로운 세계
--3D 전환이란?
--관점(Perspective)에 관한 모든 것
--기타 전환 속성들
--3D 전환을 사용하여 정육면체 들기
--전이로 정육면체 애니메이션 만들기
--3D 전환에 대한 브라우저 지원 상황
--요약
--참고 자료
8장. 애니메이션 만들기
--CSS3 애니메이션에 대해
--CSS3 애니메이션 활용
--단계적 향상을 위해 애니메이션 최소화하기
--애니메이션 결합
--CSS 애니메이션에 대한 브라우저 지원 상황
--요약
--참고 자료
3부. 새로운 레이아웃 툴에 대한 이해
9장. 다단 레이아웃
--레이아웃 툴의 진화
--레이아웃 솔루션의 새로운 기능
--다단 레이아웃 소개
--다단 레이아웃 만들기
--다단 레이아웃에 대한 브라우저 지원 상황
--요약
--참고 자료
10장. 플렉스박스 레이아웃
--플렉스박스란?
--새로운 플렉스박스 속성
--플렉스박스 레이아웃 만들기
--플렉스박스에 대한 브라우저 지원 상황
--요약
--참고 자료
11장. 격자 레이아웃, 그리고 리전과 익스클루전
--CSS 격자 레이아웃 소개
--CSS 리전 소개
--CSS 익스클루전 소개
--요약
--참고 자료
12장. CSS 미디어 쿼리와 반응형 웹
--반응형 웹 디자인이란?
--미디어 쿼리를 사용하여 기기별 디자인 만들기
--뷰포트 meta 태그 활용
--다단 레이아웃 반응형 웹 만들기
--플렉스박스 레이아웃 반응형 웹 만들기
--CSS 격자 레이아웃에 대한 한마디
--RWD의 현재
--요약
--참고 자료
4부. 한계를 넘어서
13장. 의사-요소의 창의적 활용
--의사-요소와 의사-클래스의 차이점
--의사-요소의 범주
--의사-요소로 서체 개선하기
--의사-요소를 활용한 콘텐츠 생성
--의사-요소 그 한계를 넘어서
--요약
--참고 자료
14장. 전처리기와 CSS3의 활용
--CSS 전처리기란?
--CSS 전처리기가 할 수 있는 일은?
--올바른 전처리기 선택
--전처리기의 단점에 대한 이해
--Mixin으로 CSS3 효과적으로 활용하기
--간단한 수식으로 비례 레이아웃 만들기
--함수로 다이내믹한 색상 팔레트 만들기
--전처리기에서 주의할 점
--요약
--참고 자료
15장. CSS3만을 이용한 실용적 솔루션 만들기
--CSS3만을 이용한 탭 콘텐츠 만들기
--CSS3만을 사용하여 라이트박스 기능 만들기
--CSS3만을 이용하여 3D 이미지 캐러셀 만들기
--요약
--참고 자료
16장. CSS의 미래
--CSS 변수
--CSS 선택자: 레벨 4
--CSS의 조건 규칙을 사용한 브라우저 지원
--의사-요소: 레벨 4
--자신의 목소리를 내라!
--요약
--참고 자료
저렴한 가격의 책은 아니니 조금 기대가 컷다. 아름답고 다양한 레이아웃 예제와 apple product page같은 멋진 애니메이션 예제가 가득 할 거라 생각했는데 조금 과하게 기대했던 것 같다.
2부를 제외한 나머지는 mdn사이트에서 볼 수 있는 내용을 짜집기 한 것 같고 플렉스 박스같은 경우 네이버 d2의 플렉스레이아웃에 관한 글이 도움이 더 되었던 것 같다.
사실 2부도 마찬가지이다. 애니메이션을 잘 안 쓰고 복잡한 css애니메이션은 창문이 열리는 듯한 애니메이션 예제가 있는데 무슨 90년대 www 보는 줄 알았다.
데모파일 다운로드 하는것이 압권인데, 비제이퍼블릭 사이트에 들어가서 관리자 계정 아이디 비밀번호를 치고 들어가서 다운로드 받아야 했다. (그런데 사이트가 없어져서 안된다. )
요약 : 중고급 전문 예제를 기대하고 사면 안될 책 그저 css3에 새롭게 도입된 내용들 사용법