CSS에서 색상을 표현하는 방법에는 여러 가지가 있습니다.

CSS에서 색상을 표현하는 방법에는 다음과 같은 6가지가 있습니다. 1. 빨간색, 파란색과 같은 영어 단어 2. "#FF0000"과 같은 16진수 값 3. "RGB(255,0) , 0)", 4. RGBA(예: "RGB(255,0,0,0.5)"), 5. HSL, 6. HSLA.

이 튜토리얼의 운영 환경: Windows 7 시스템, CSS3 버전, Dell G3 컴퓨터.

추천 튜토리얼: css 비디오 튜토리얼

css의 다양한 색상 표현

1. 웹 페이지에 미리 정의된 색상은 빨간색, 파란색 등과 같은 영어 단어를 사용합니다.

2.

#F00과 같은 3자리 16진수(각 색상은 16진수로 표시됨)

#FF0000과 같은 6자리 16진수(각 색상은 16진수 시스템으로 표시됨)

3.

RGB 세 가지 기본 색상: RGB(255,0,0) 주어진 세 가지 매개변수는 0에서 225까지의 빨간색, 녹색 및 파란색의 색상 값을 나타냅니다. 소수점 표현

RGB, RGB(100%, 0) %, 0%), 백분율 기호 사용

참고: 위의 표현식은 모두 RGB 색상 시스템(빨간색, 녹색, 파란색)에 속합니다.

4, RGBA : RGB와 동일하지만 RGB( 255,0,0,0.5). 네 번째 값의 범위는 0-1이며, 0은 완전히 투명하고 1은 완전히 불투명합니다

5. HSL(색상 조정 후 학습에 더 많이 사용됨): 색조, 채도, 밝기. 예를 들어 HSL(360,100%,50%)입니다.

색조: 색의 기본 속성으로 빨간색 등 우리가 흔히 색 이름이라고 부르는 것입니다.

채도: 색의 순도를 말하며, 높을수록 색이 더 순수합니다. , 낮을수록 점차 회색으로 변해 0~100% 값

밝기: 색상의 밝기입니다. 색상의 밝기가 높을수록 색상의 밝기가 어두워집니다. , 색상이 어두워질수록 0~100%가 소요됩니다.

(페이지에 컬러 시스템을 사용하려는 경우 HSL을 사용하면 됩니다)

6. HSLA: HSL보다 투명도가 높습니다.

사용법:

①color:blue;

첫 번째 방법은 color 속성을 호출하고, 콜론 뒤에 색상의 영문명을 입력하고, 세미콜론으로 끝나는 것입니다.

이 방법은 간단하지만 표현할 수 있는 색상의 종류가 거의 없습니다.

②color:#000000;

두 번째 유형은 '#'으로 시작하며 각 숫자는 0, 1, 2, 3, 4, 5, 6, 7, 8,

9, a, b ,c입니다. ,d,e,f. 처음 1자리와 2자리는 빨간색, 3자리와 4자리는 녹색, 5자리와 6자리

자리는 파란색을 나타냅니다. RGB 색상 표현의 아이디어와 마찬가지로 빨강, 녹색, 파랑의 삼원색을 조합하여

다양한 색상으로 종류가 많습니다.

3color:rgb(0,0,0);

세 번째 방법은 RGB 표현입니다. 값에는 두 가지 유형이 있습니다. 숫자 값, 모든 값은 0-255, 백분율 값 ​​

, 모든 값은 0%-100%입니다. 공통점은 첫 번째 값이 빨간색을 나타내고, 두 번째

값이 녹색, 세 번째 값이 파란색을 나타낸다는 것입니다. 조합을 통해 다양한 색상을 표현할 수 있습니다.

4color:rgba(0,0,0,0.5);

네번째는 RGBA 표현입니다. RGB 표현의 업그레이드 버전이며 새로운 투명도 속성을 추가합니다.

처음 세 개의 속성 값은 RGB 표기법과 동일합니다. 네 번째 속성 값의 값 범위는 0~1이며 소수점 이하 두 자리까지 정확할 수 있습니다.

⑤color:hsl (0, 100%, 100%)

다섯 번째 방법, HSL 표현. 의미: H는 색상을 나타내고, 값 범위는 0-

360이며, 0과 360은 빨간색을 나타내고, 120은 녹색을 나타내고, 240은 파란색을 나타냅니다. S는 채도

를 나타내며 값 범위는 0%-100%입니다. L은 밝기를 나타내며 값 범위는 0%-100%입니다.

⑥color:hsla(0,100%,100%,0.5);

여섯 번째, HSLA 표기법. HSL 표기법의 향상된 버전으로, 0-1의 값 범위에 투명도 값인

속성을 추가합니다.

더 많은 프로그래밍 관련 지식을 보려면

프로그래밍 교육

을 방문하세요! !

위 내용은 CSS에서 색상을 표현하는 방법에는 여러 가지가 있습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!