반응형
CSS3는 CSS와 완전히 호환되며 차이점은 다음과 같은 것들이 있습니다.
선택자 Level3
미디어 쿼리 Level3
색 Level3
네임스페이스
CSS3 모듈
선택자 — 많은 선택자가 새롭게 정의
박스 모델 —
배경 —
이미지 —
텍스트 효과 —
2D 변형 —
3D 변형 —
애니메이션 —
다중 칼럼 레이아웃 —
사용자 인터페이스 —
벤더 프리픽스 (vendor prefix)
- -ms- 익스플로러
- -webkit- 크롬
- -moz- 파이어폭스
- -webkit- 사파리
- -o- 오페라
웹 브라우저 공급자가 제공하는 새로운 기능을 이전 버전의 웹 브라우저에 알려주기 위해 사용되는 접두어
CSS3 변형
Transition
ccs 스타일 전환 효과를 설정합니다.
transition
transition-delay
transition-duration
transition-property
transition-timing-function
Transform
ccs3에서 html 요소의 모양, 크기, 위치 등을 변형시킬 수 있습니다.
3D
- rotate() : 회전
- translate()
- scale()
- matrix()
- perspective()
Animation
@keyframes
animation-duration 속성 — 애니메이션 효과를 재생할 시간
animation-delay 속성 — 효과가 나타나기까지의 지연시간
Gradient
Linear Gradient — 두 개 이상의 색상 지정점을 선형으로 그래디언트 효과를 적용
관련포스트
반응형
'웹 개발 > 웹프로그래밍' 카테고리의 다른 글
코드이그나이터 | index.php 제거 (0) | 2021.01.26 |
---|---|
CSS | 6-2. 레이아웃 Grid (0) | 2021.01.25 |
CSS | 6-1. 레이아웃 Flex (0) | 2021.01.24 |
HTML | 2. 기본 구조 (0) | 2021.01.06 |
CSS | 9. 미디어 쿼리 (0) | 2020.12.26 |
CSS | 6. 레이아웃 (0) | 2020.12.25 |
CSS | 8. 구체성과 상속 (0) | 2020.12.24 |
CSS | 7. 조합자와 가상선택자 (0) | 2020.12.23 |
댓글