>  기사  >  웹 프론트엔드  >  HTML 색상 

HTML 색상 

王林
王林원래의
2024-09-04 16:33:57608검색

이 글에서는 HTML을 사용하여 웹사이트에서 색상을 간단하고 쉽게 사용하는 방법을 다룹니다. 색상은 보기에 좋고 느낌이 좋은 웹사이트를 만드는 데 중요한 역할을 합니다. HTML에는 개별 태그가 내장되어 있지 않습니다. 대신 스타일 속성이나 색상 속성을 사용합니다. 정확하게 말하면 색상은 CSS(Cascading Style Sheet)를 사용하여 HTML 요소에 포함됩니다. 색상은 웹 페이지에 우아한 느낌을 줍니다. 웹페이지에 색상을 추가하는 작업에는 배경색, 표, 단락 등을 설정하는 작업이 포함됩니다.

HTML에서 배경색을 설정하는 방법은 무엇입니까?

배경색을 밝게 하면 홈페이지가 더욱 예쁘고 강렬해 보입니다. 색상, Hex 색상 코드를 사용하여 수행됩니다. RGB 및 RGBA 색상 값(알파 값 0~1).

Html의 body 요소 내부에 있는 Style 속성을 사용하여 Html 코드에 16진수 색상이 직접 적용됩니다. Hex는 숫자와 문자의 조합입니다. 아래는 웹 페이지의 배경색을 예시한 것입니다.

코드:

<!DOCTYPE html>
<title>My Sample</title>
<html>
<head>
<title>HTML BG Color</title>
</head>
<body style="background-color:red;">
<h1> This page is a demo </h1>
</body>
</html>

코드 조각:

HTML 색상 

배경색을 추가하려면 bgcolor 속성을 사용하여 < 본문 bgcolor=' '>. HTML 5를 제외한 모든 브라우저와 호환됩니다.

코드:

<h3 style="color: blue">Color Name</h3>
<h3 style="color: #0000ff">Hexadecimal</h3>
<h3 style="color: rgb (0,0,255)">RGB Value</h3>

HTML 텍스트에 색상을 적용하는 방법은 무엇입니까?

HTML 텍스트에 색상을 적용하는 것은 매우 쉽습니다. Hex 색상, HSL 값, 색상 이름의 세 가지 방법을 적용하여 텍스트 색상을 추가/변경할 수 있습니다. 다음은 해당 웹 페이지에 색상을 적용하는 세 가지 기술입니다.

1. 색상 이름

응용 프로그램이 간단할 때 영어 색상 이름을 사용하면 매우 간단합니다. 색상명 지정은 직접적인 방법이며, W3C는 16가지 기본 색상(Black, Yellow, Red, Maroon, Grey, Lime, Green, Olive, Silver, Aqua, Blue, Navy, White, Purple, Fuchsia, Teal)을 발표했습니다

2. HSL

색조 채도 및 밝기 색상 값. 색상은 0~360도, 채도와 밝기는 0~100%로 정의됩니다.

3. 16진수 색상

정확한 결과를 얻으려면 6자리 16진수 숫자가 적용됩니다. 자세히 설명하면 처음 두 자리는 빨간색, 다음 두 자리는 녹색, 나머지 두 자리는 파란색 값을 나타내며 앞에 '#'이 붙습니다.

다음 예에서는 문서에 색상을 적용하는 다양한 방법을 설명합니다.

코드:

<head>
<title>EDUCBA</title>
<style type="text/css">
h1{
color:#97cae0;
background-color: hsl(200, 50%, 20%);
color: hsl(200, 20%, 90%);
}
h4{
color:rgb(0, 255, 0);
background-color: hsl(130, 10%, 30%);
color: hsl(280, 20%, 80%);
}
li{
color:rgba(12, 88, 120, 1);
background-color: hsl(210, 36%, 50%);
color: hsl(145, 45%, 81%);
}
</style>
</head>
<body>
<h1>EDUCBA</h1>
<h4>List of operating System</h4>
<ul>
<li> Windows</li>
<li>MACINTOSH</li>
<li>LINUX</li>
<li>UBUNTU</li>
</ul>
</body>
</html>

출력:

HTML 색상 

HTML에는 사용자 정의할 수 있는 응용 프로그램이 많기 때문에 텍스트 색상을 지정하는 방법에는 여러 가지가 있습니다.

  • 스타일 적용 섹션
  • 개별 CSS 스타일 시트 만들기
  • 텍스트 감싸기

<스타일>을 사용하여 텍스트 색상을 적용하는 방법 섹션?

HTML 색상을 사용하는 다양한 방법을 살펴보겠습니다.

1. HTML 색상을 사용한 래핑

아래 코드는 간단한 HTML 코드로 단락의 텍스트 색상을 변경합니다. 웹사이트를 색칠할 수 있는 140가지 색상의 이름이 있습니다.

아래 코드는