CS의 색상 탐색

<p>CSS 색상 마스터 링 : 포괄적 인 가이드 이전 수업에서는 CSS 선택기를 탐색했습니다. 이제 색상 변형부터 선택한 요소의 모양을 조작하는 방법을 배우면서 그 지식을 바탕으로합시다. 이 안내서는 색상 이름, 16 진 코드, RGB 값 및 HSL 형식을 포함하여 CSS의 색상을 정의하는 다양한 방법을 다룹니다. 이전에 보여 지듯이, HTML 요소를 선택한 후 (예를 들어,

단락) 속성을 ​​사용하여 텍스트 색상을 수정할 수 있습니다. <p> 마찬가지로,

속성은 요소의 배경을 변경합니다 <p> CSS는 "빨간색"및 "Darkorange"와 같은 일반적인 색상 이름을 지원하지만 가능한 모든 색조를 포함하지는 않습니다. 정확한 색상 제어를 위해 RGB, 16 진수 및 HSL 컬러 모델이 더 큰 유연성을 제공합니다. rgb 컬러 모델 rgb (빨간색, 녹색, 파란색)는 컴퓨터 시스템에서 색상 표현의 기초를 형성합니다. 이 세 가지 기본 색상을 혼합하면 광범위한 색조가 생성됩니다. 함수는 rgb 색상을 정의합니다 <p> 각 매개 변수 (, , )는 각 색상 구성 요소의 강도를 나타내는 0과 255 사이의 정수 값을 허용합니다. 0은 가장 약한 강도를 나타내고 255는 가장 강력합니다. 예를 들어 : color

다른 강도를 결합하면 다양한 색상이 생성됩니다

<code class="language-css">p {
  color: red;
}</code>

숫자 값을 선택하는 데 RGB 값을 선택하는 데 컬러 피커 도구를 적극 권장합니다. 숫자 값만으로 결과 색상을 예측하는 데 어려움이 있습니다. <p> background-color 함수는 알파 채널을 추가하여 를 연장합니다.

<code class="language-css">p {
  background-color: darkorange;
}</code>

파라미터 (0.0 ~ 1.0)는 투명성을 제어합니다. 0.0은 완전히 투명하며 1.0은 완전히 불투명합니다 <p>

16 진 컬러 모델

16 진수는 16 진수 표기법을 사용합니다 <p> rgb() 기호는 6 자리 육각형 코드보다 우선합니다. 각 쌍 (, , )은 각각 00 (0 십진)에서 FF (255 소수) 범위의 빨간색, 녹색 및 파란색 구성 요소를 나타냅니다. 예를 들면 :

<code class="language-css">rgb(<red>, <green>, <blue>)</code>

8 자리 육각 코드를 사용하여 투명성을 추가 할 수 있습니다 <p> 는 알파 채널을 나타냅니다 (00 ~ ff, 0.0 ~ 1.0으로 매핑). red 이것은 green blue

hsl 컬러 모델 HSL (색조, 채도, 가벼움)은 그래픽 디자이너에게 친숙한 컬러 모델입니다. 기능은 다음을 사용합니다

는 컬러 휠의 색상 위치를 나타냅니다 (0 ~ 360도).

<p> (0% ~ 100%)는 색상의 강도를 나타냅니다 (0%는 회색이고 100%는 풀 컬러입니다). hsl()

(0% ~ 100%) 추가 된 검은 색 또는 흰색의 양을 결정합니다 (0%는 검은 색, 100%는 흰색입니다).

<code class="language-css">p {
  color: red;
}</code>

. <p> hue

투명성을 위해 알파 채널을 추가합니다 : <p> 이것은

및 <p> 추가 탐사 saturation css 로 다중 열 레이아웃 생성 마스터 링 CSS 그리드 레이아웃 CSS를 사용하여 Flexbox 레이아웃 구축 <p>

위 내용은 CS의 색상 탐색의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!