HTML 텍스트 설정 색상

王林
풀어 주다: 2023-05-09 09:44:37
원래의
3282명이 탐색했습니다.

HTML 텍스트 색상 설정

HTML에서는 텍스트 색상을 설정하여 페이지를 더욱 다채롭게 보이게 할 수 있습니다. 텍스트 색상 설정은 텍스트 단락, 제목, 링크 등과 같은 다양한 요소에 적용될 수 있습니다. 이번 글에서는 HTML에서 텍스트 색상을 설정하는 방법과 CSS를 사용하여 텍스트 색상을 보다 편리하게 제어하는 ​​방법을 소개하겠습니다.

  1. HTML 텍스트 색상 기본 설정

HTML에서는 색상 이름이나 16진수 색상 값을 사용하여 텍스트 색상을 정의할 수 있습니다. 다음은 일반적으로 사용되는 HTML 색상 이름입니다.

  • red: 빨간색
  • green: 녹색
  • blue: 파란색
  • black: 검정색
  • white: 흰색

다음과 같은 방법으로 색상을 적용할 수 있습니다.

<p style="color:red;">这是红色的文本。</p>
<p style="color:green;">这是绿色的文本。</p>
<p style="color:blue;">这是蓝色的文本。</p>
<p style="color:black;">这是黑色的文本。</p>
<p style="color:white; background-color:black;">这是白色的文本。</p>
로그인 후 복사

위의 예에서는 스타일 속성을 사용하여 색상을 설정했습니다. style 속성에 color 속성을 추가하면 텍스트의 색상을 설정할 수 있습니다.

색상 이름을 사용하는 것 외에도 16진수 색상 값을 사용하여 텍스트 색상을 정의할 수도 있습니다. 다음은 몇 가지 예입니다.

<p style="color:#ff0000;">这是红色的文本。</p>
<p style="color:#00ff00;">这是绿色的文本。</p>
<p style="color:#0000ff;">这是蓝色的文本。</p>
<p style="color:#000000;">这是黑色的文本。</p>
<p style="color:#ffffff; background-color:#000000;">这是白色的文本。</p>
로그인 후 복사

위 예에서는 # 문자와 색상 코드를 사용하여 색상을 설정했습니다. 색상 코드는 6개의 16진수 숫자로 구성되며 각각 빨간색, 녹색, 파란색의 밝기 값을 나타냅니다. 예를 들어 #ff0000은 빨간색을 나타내고, ff는 빨간색의 최대 밝기 값을 나타냅니다.

  1. CSS를 사용하여 텍스트 색상 설정

위 예에서는 스타일 속성을 사용하여 텍스트 색상을 설정했습니다. 하지만 대규모 웹사이트나 프로젝트의 경우 여러 페이지와 요소에 동일한 스타일을 적용해야 합니다. 이 경우 CSS를 사용하여 페이지의 모양과 스타일을 제어할 수 있습니다.

먼저 내부 스타일시트를 사용하여 텍스트 색상을 설정하는 방법을 살펴보겠습니다. 내부 스타일 시트는 HTML 문서의 헤드에 있는