[Programming/HTML|CSS] CSS3 Cheat Sheet

주석

스타일 속성 이름	설명
/* 주석 */	부가 설명

---

폰트 관련 속성

스타일 속성 이름	설명
font	폰트
font-family	폰트 종류
font-size	폰트 크기
font-style	폰트 형태
font-variant	폰트 변형
font-weight	폰트 두깨

---

변환 관련 속성

스타일 속성 이름	설명
transform	변환
transform-origin	변환 중심
transform-style	변환 형태
perspective	투시 수치
perspective-origin	투시 중심
backface-visibility	후면 가시성

---

애니메이션 관련 속성

스타일 속성 이름	설명
animation	애니메이션
animation-name	애니메이션 이름
animation-duration	애니메이션 진행 시간
animation-timing-function	애니메이션 수치 변환 함수
animation-delay	애니메이션 지연 시간
animation-iteration-count	애니메이션 반복 횟수
animation-direction	애니메이션 방향
animation-play-state	애니메이션 진행 상태

---

배경 속성

스타일 속성 이름	설명
background	배경
background-attachment	배경 부착 방식
background-color	배경 색상
background-image	배경 이미지
background-position	배경 위치
background-repeat	배경 반복 형식
background-clip	배경 적용 범위
background-origin	배경 중심 위치
background-size	배경 크기

---

테두리 속성

스타일 속성 이름	설명
border	테두리
border-color	테두리 색상
border-style	테두리 형태
border-width	테두리 두께
border-radius	테두리 곡률
border-image	테두리 이미지
border-image-outset
border-image-repeat	테두리 반복 형식
border-image-slice	테두리 이미지 분할 비율
border-image-source	테두리 이미지 파일
border-image-width	테두리 이미지 두께
outline	테두리 외곽
outline-color	테두리 외곽 색상
outline-width	테두리 외곽 두께

---

그림자 속성

스타일 속성 이름	설명
text-shadow	글자 그림자
box-shadow	박스 그림자

---

박스 관련 속성

스타일 속성 이름	설명
width	너비
height	높이
margin	마진
padding	패딩
box-sizing	크기 지정 방식

---

가시 속성

스타일 속성 이름	설명
display	표시 형태
visibility	가시성
opacity	투명도
overflow	내용물이 넘칠 경우의 처리 방식

---

위치 속성

스타일 속성 이름	설명
position	위치 지정 방식
left	왼쪽
top	위
right	오른쪽
bottom	아래
z-index	태그의 스택 순서
float	부유 방식

---

글자 관련 속성

스타일 속성 이름	설명
color	글자 색상을 지정한다.
direction	글자 진행 방향
letter-spacing	글자 간격
line-height	글자 높이
text-align	글자 정렬 방식
text-decoration	글자 꾸밈 방식
text-indent	글자 들여쓰기 크기
text-transform	글자 변환
vertical-align	글자 수직 정렬 방식
white-space	글자 공백 처리 방식
text-overflow	글자가 넘칠 경우의 처리 방식
word-spacing	단어 간격
word-wrap	단어가 넘칠 경우의 처리 방식