CSS CSS 색상
CSS 색상
1. CSS색상 (컬러)값의 종류(색 표현 방법)
| 구분 | 설명 | 예시 |
|---|---|---|
| 키워드 | 영문으로 컬러값 작성 | color: red; |
| rgb | rgb(레드,그린,블루) 수치 작성 | color: rgb(20,20,20); |
| hsl | hsl(색상,채도,명도) 수치 작성 | color: hsl(70,70%,70%); |
| hex | rgb를 16진법코드 변환 | color: #333333; |
| rgba | rgb방식에 alpha(투명도)추가 | color: rgba(20,20,20,0.5); |
| hsla | hsl방식에 alpha(투명도)추가 | color: hsla(70,70%,70%,0.5); |
2. 컬러값을 적용 시킬 수 있는 CSS속성명
| 구분 | 설명 | 예시 |
|---|---|---|
| color | 글자색 지정 속성 | h1{ color: red; } |
| background-color | 배경색 지정 속성 | h1{ background-color: orange; } |
| border-color | 테두리색 지정 속성 | h1{ border: 3px solid blue; } |
| box-shadow | 요소 그림자 지정속성(그 중 색상적용시 사용) | h1{ box-shadow: 2px 2px 2px red; } |
| text-shadow | 글자 그림자 지정속성(그 중 색상적용시 사용) | h1{ text-shadow: 2px 2px 2px red; } |
3.색상 코드 표(차트)
| 인터넷에 검색하기 |