CSS에서 글꼴 색상 설정

CSS는 Cascading Style Sheets의 약자로, 스타일 제어 및 레이아웃을 위한 언어입니다. CSS에서 글꼴 색상 설정은 HTML 웹 페이지의 텍스트 내용에 색상을 추가할 수 있는 기본 스타일 작업입니다. 이번 글에서는 CSS를 사용하여 글꼴 색상을 설정하는 방법을 살펴보겠습니다.

1. 색상 키워드 사용

CSS는 검정색, 흰색, 빨간색, 녹색, 파란색 등 사용자가 일반적으로 사용하는 일련의 색상 키워드를 제공합니다. 스타일시트에서 이러한 키워드를 사용하여 텍스트 색상을 설정할 수 있습니다. 예:

body {
  color: red;
}

위 코드는 웹 페이지 전체의 텍스트 색상을 빨간색으로 설정합니다.

2. 16진수 색상 값 사용

CSS는 색상 키워드 외에도 RGB 또는 16진수 색상 값을 사용하여 글꼴 색상을 설정할 수 있도록 지원합니다. 그 중 16진수 색상 값이 가장 일반적으로 사용됩니다. 16진수 색상값은 빨간색, 녹색, 파란색의 3원색 값을 16진수로 변환하여 표현됩니다. 예를 들어 빨간색의 16진수 색상 값은 #FF0000, 녹색의 경우 #00FF00, 파란색의 경우 #0000FF입니다.

16진수 색상 값을 사용하여 글꼴 색상을 설정하는 방법은 다음과 같습니다.

body {
  color: #FF0000;
}

위 코드는 웹 페이지 전체의 텍스트 색상을 빨간색으로 설정합니다.

3. RGB 색상 값 사용

CSS에서는 16진수 색상 값 외에도 RGB 색상 값을 사용하여 글꼴 색상을 설정할 수도 있습니다. RGB 색상값은 빨간색, 녹색, 파란색의 3원색 값으로 표현됩니다. 예를 들어 빨간색의 경우 RGB 색상 값은 rgb(255, 0, 0), 녹색의 경우 rgb(0, 255, 0), 파란색의 경우 rgb(0, 0, 255)입니다.

RGB 색상 값을 사용하여 글꼴 색상을 설정하는 방법은 다음과 같습니다.

body {
  color: rgb(255, 0, 0);
}

위 코드는 웹 페이지 전체의 텍스트 색상을 빨간색으로 설정합니다.

4. 다른 요소에 적용

CSS를 통해 HTML 요소마다 다른 글꼴 색상을 설정할 수도 있습니다. 예를 들어 h1 요소의 글꼴 색상을 빨간색으로 설정하고 p 요소의 글꼴 색상을 녹색으로 설정할 수 있습니다.

h1 {
  color: #FF0000;
}

p {
  color: #00FF00;
}

위 코드는 h1 요소의 글꼴 색상을 빨간색으로, p 요소의 글꼴 색상을 녹색으로 설정합니다.

요약

CSS에서는 색상 키워드, 16진수 색상 값 또는 RGB 색상 값을 사용하여 HTML 웹 페이지의 텍스트 콘텐츠에 대해 서로 다른 색상을 설정할 수 있습니다. 동시에 더 나은 시각적 효과를 얻기 위해 필요에 따라 다양한 HTML 요소에 대해 서로 다른 글꼴 색상을 설정할 수도 있습니다.

위 내용은 CSS에서 글꼴 색상 설정의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!