728x90
1. 색상 표현 방법
-색상명 사용
: 색상에 해당하는 영어 단어를 직접 사용
*RGB 색 모델
-> 3원색의 성분이 더해져서 색을 만드는 모델
: 16진수 사용
: RGB 함수 사용
-> rgb(R, G, B) : R, G, B의 각 값을 0~255 사이의 10진수로 표시
-> rgb(R%, G%, B%) : R, G, B 각 값을 백분율(0~100%)로 표시
-> rgb(R, G, B, Alpha)
* rgb(R, G, B) + 투명도 (0.0 완전 투명 ~ 1.0 완전 불투명)
* rgb(R, G, B) = rgba(R, G, B, 1.0)
* HSL 색 모델
-색조 : 반사광의 색 성분을 경정하는 강한 에너지
-채도(S) : 색이 순수한 스펙트럼 색에 얼마나 가까운 가를 나타내는 성분 -> 색상의 선명함
-밝기(L) : 빛의 전체적인 에너지의 크기 -> 색상의 밝기
: HSL 함수 사용
-> hsl(색조, 채도, 밝기)
*색조 -> 색상환의 각도로 표시(red=0=360, green=120, blue=240)
*채도 -> 0% 무채색 ~ 100% 순색
*밝기 -> 0% 검은색 ~ 50% 평균 ~ 100% 흰색
-> hsla(색조, 채도, 밝기, Alpha)
* hsl() + 투명도 (0.0 완전 투명 ~ 1.0 완전 불투명)
-색상 지정 관련 속성
| color | HTML 요소의 텍스트 색상 *값 -> <색상>, transparent = rgba(0, 0, 0, 0) |
| background-color | HTML 요소의 배경색 |
| border-color | 테두리 색상 |
| opacity | 요소의 불투명도 *값 -> 0.0(완전 투명) ~ 1.0(완전 불투명) |
ex)
ex2)
ex2 - 출력)
728x90
