HTML colors are specified using predefined color names, or RGB, HEX, HSL, RGBA, HSLA values.
HTML 색상은 미리 정의 된 색상 이름 또는 RGB, HEX, HSL, RGBA, HSLA 값을 사용하여 지정됩니다.
Color Names
색상 이름
In HTML, a color can be specified by using a color name:
HTML에서는 색상 이름을 사용하여 색상을 지정할 수 있습니다.
HTML supports 140 standard color names.
HTML은 140 개의 표준 색상 이름을 지원 합니다 .
Background Color
배경색
You can set the background color for HTML elements:
HTML 요소의 배경색을 설정할 수 있습니다.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Example
1 2 | <h1 style="background-color:DodgerBlue;">Hello World</h1> <p style="background-color:Tomato;">Lorem ipsum...</p> | cs |
Text Color
텍스트 색상
You can set the color of text:
텍스트 색상을 설정할 수 있습니다.
Hello World
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Example
1 2 3 | <h1 style="color:Tomato;">Hello World</h1> <p style="color:DodgerBlue;">Lorem ipsum...</p> <p style="color:MediumSeaGreen;">Ut wisi enim...</p> | cs |
Border Color
테두리 색
You can set the color of borders:
테두리 색상을 설정할 수 있습니다.
Hello World
Hello World
Hello World
Example
1 2 3 | <h1 style="border:2px solid Tomato;">Hello World</h1> <h1 style="border:2px solid DodgerBlue;">Hello World</h1> <h1 style="border:2px solid Violet;">Hello World</h1> | cs |
Color Values
색상 값
In HTML, colors can also be specified using RGB values, HEX values, HSL values, RGBA values, and HSLA values:
HTML에서는 RGB 값, HEX 값, HSL 값, RGBA 값 및 HSLA 값을 사용하여 색상을 지정할 수도 있습니다.
Same as color name "Tomato":
색상 이름 "토마토"와 동일 함 :
Same as color name "Tomato", but 50% transparent:
색 이름 "토마토"와 동일하지만 50 % 투명 :
Example
1 2 3 4 5 6 | <h1 style="background-color:rgb(255, 99, 71);">...</h1> <h1 style="background-color:#ff6347;">...</h1> <h1 style="background-color:hsl(9, 100%, 64%);">...</h1> <h1 style="background-color:rgba(255, 99, 71, 0.5);">...</h1> <h1 style="background-color:hsla(9, 100%, 64%, 0.5);">...</h1> | cs |
RGB Value
RGB 값
In HTML, a color can be specified as an RGB value, using this formula:
HTML에서는 다음 공식을 사용하여 색상을 RGB 값으로 지정할 수 있습니다.
rgb(red, green, blue)
rgb ( 빨강, 초록 , 파랑 )
Each parameter (red, green, and blue) defines the intensity of the color between 0 and 255.
각 매개 변수 (빨강, 녹색 및 파랑)는 0에서 255 사이의 색상 강도를 정의합니다.
For example, rgb(255, 0, 0) is displayed as red, because red is set to its highest value (255) and the others are set to 0.
예를 들어, 빨간색은 가장 높은 값 (255)으로 설정되고 다른 값은 0으로 설정되므로 rgb (255, 0, 0)는 빨간색으로 표시됩니다.
To display the color black, all color parameters must be set to 0, like this: rgb(0, 0, 0).
색상을 검정색으로 표시하려면 모든 색상 매개 변수를 다음과 같이 0으로 설정해야합니다. rgb (0, 0, 0).
To display the color white, all color parameters must be set to 255, like this: rgb(255, 255, 255).
흰색을 표시하려면 모든 색상 매개 변수를 다음과 같이 255로 설정해야합니다. rgb (255, 255, 255).
Experiment by mixing the RGB values below:
아래의 RGB 값을 혼합하여 실험 해보십시오.
rgb(255, 99, 71)
RED
GREEN
BLUE
Shades of gray are often defined using equal values for all the 3 light sources:
회색 음영은 종종 모든 3 개의 광원에 대해 동일한 값을 사용하여 정의됩니다.
HEX Value
16 진수 값
In HTML, a color can be specified using a hexadecimal value in the form:
HTML에서는 다음 형식의 16 진수 값을 사용하여 색상을 지정할 수 있습니다.
#rrggbb
Where rr (red), gg (green) and bb (blue) are hexadecimal values between 00 and ff (same as decimal 0-255).
rr (빨강), gg (녹색) 및 bb (파랑)는 00에서 ff 사이의 16 진수 값입니다 (십진수 0-255와 동일).
For example, #ff0000 is displayed as red, because red is set to its highest value (ff) and the others are set to the lowest value (00).
예를 들어, 빨간색은 가장 높은 값 (ff)으로 설정되고 다른 값은 가장 낮은 값 (00)으로 설정되므로 #ff0000은 빨간색으로 표시됩니다.
Shades of gray are often defined using equal values for all the 3 light sources:
회색 음영은 종종 모든 3 개의 광원에 대해 동일한 값을 사용하여 정의됩니다.
HSL Value
HSL 가치
In HTML, a color can be specified using hue, saturation, and lightness (HSL) in the form:
HTML에서는 색상, 채도 및 명도 (HSL)를 사용하여 다음과 같은 형식으로 색상을 지정할 수 있습니다.
hsl(hue, saturation, lightness)
hsl ( 색조 , 채도 , 명도 )
Hue is a degree on the color wheel from 0 to 360. 0 is red, 120 is green, and 240 is blue.
색상은 0에서 360까지의 색상환에 대한 정도입니다. 0은 빨간색이고 120은 녹색이며 240은 파란색입니다.
Saturation is a percentage value, 0% means a shade of gray, and 100% is the full color.
채도는 백분율 값이고, 0 %는 회색 음영을 나타내며 100 %는 풀 컬러입니다.
Lightness is also a percentage, 0% is black, 50% is neither light or dark, 100% is white
밝기도 백분율, 0 %는 검은 색, 50 %는 밝거나 어두움, 100 %는 흰색입니다.
Example
Saturation
포화
Saturation can be described as the intensity of a color.
채도는 색상의 강도로 설명 할 수 있습니다.
100% is pure color, no shades of gray
100 % 순수한 색상, 회색 음영 없음
50% is 50% gray, but you can still see the color.
50 %는 50 % 회색이지만 여전히 색상을 볼 수 있습니다.
0% is completely gray, you can no longer see the color.
0 %가 완전히 회색이면 더 이상 색상을 볼 수 없습니다.
Example
Lightness
가벼움
The lightness of a color can be described as how much light you want to give the color, where 0% means no light (black), 50% means 50% light (neither dark nor light) 100% means full lightness (white).
밝기는 색상을 지정하려는 빛의 양으로 표시 할 수 있습니다. 0 %는 빛이 없음을 의미하고 50 %는 50 %의 빛을 의미합니다 (어두운 것도 밝은 것도 없음). 100 %는 완전한 밝기 (흰색)를 의미합니다.
Example
Shades of gray are often defined by setting the hue and saturation to 0, and adjust the lightness from 0% to 100% to get darker/lighter shades:
회색 음영은 종종 색조 및 채도를 0으로 설정하고 밝기를 0 %에서 100 %까지 조정하여 어두운 / 어두운 색조를 얻도록 정의됩니다.
Example
RGBA Value
RGBA 값
RGBA color values are an extension of RGB color values with an alpha channel - which specifies the opacity for a color.
RGBA 색상 값은 색상의 불투명도를 지정하는 알파 채널이있는 RGB 색상 값의 확장입니다.
An RGBA color value is specified with:
RGBA 색상 값은 다음과 같이 지정됩니다.
rgba(red, green, blue, alpha)
rgba ( 빨강, 초록 , 파랑, 알파 )
The alpha parameter is a number between 0.0 (fully transparent) and 1.0 (not transparent at all):
알파 매개 변수는 0.0 (완전 투명)과 1.0 (투명하지 않음) 사이의 숫자입니다.
Example
HSLA Value
HSLA 가치
HSLA color values are an extension of HSL color values with an alpha channel - which specifies the opacity for a color.
HSLA 색상 값은 색상의 불투명도를 지정하는 알파 채널이있는 HSL 색상 값의 확장입니다.
An HSLA color value is specified with:
HSLA 색상 값은 다음과 같이 지정됩니다.
hsla(hue, saturation, lightness, alpha)
hsla ( 색조, 채도 , 밝기, 알파 )
The alpha parameter is a number between 0.0 (fully transparent) and 1.0 (not transparent at all):
알파 매개 변수는 0.0 (완전 투명)과 1.0 (투명하지 않음) 사이의 숫자입니다.
Example
출처 : W3School.com
'HTML' 카테고리의 다른 글
| HTML 링크(HTML Links) (0) | 2018.06.13 |
|---|---|
| HTML 스타일 - CSS(HTML Styles - CSS) (0) | 2018.06.12 |
| HTML 주석(HTML Comments) (0) | 2018.06.10 |
| HTML 인용문 및 인용문 요소(HTML Quotation) (0) | 2018.06.09 |
| HTML 텍스트 서식 지정(HTML Text Formatting) (0) | 2018.06.08 |
