<!DOCTYPE html>
<html>
<head>
<title>::: 07_HTML_태그소개_색상지정방식 :::</title>
</head>
<body>
<hr/>
<h3>색상지정방식 1 - 색상 [이름]을 이용하는 방식</h3>
<p style="background-color:red;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:orange;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:yellow;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:blue; color:white;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:cyan;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<h3>색상지정방식 2 - 색상 [RGB]값을 이용하는 방식</h3>
<p style="background-color:rgb(255, 0, 0);">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:rgb(0, 255, 0);">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:rgb(0, 0, 255);">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:rgb(255, 255, 0);">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:rgb(0, 255, 255);">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<hr/>
<h3>색상지정방식 3 - 색상 [16진수]값을 이용하는 방식</h3>
<p style="background-color:#FF0000;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:#00FF00;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:#0000FF;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:#FFFF00; color:#FF0000">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
<p style="background-color:#00FFFF;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
</p>
<p style="background-color:#000000; color:white;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
</p>
<p style="background-color:#808080; color:white;">
이곳은 내용입니다. 색상이 지정됩니다.
</p>
</body>
</html>
'html' 카테고리의 다른 글
| 09. html 태그_스타일 지정 방식(.css 활용) (0) | 2023.03.03 |
|---|---|
| 08. html 태그_스타일 지정 방식 (0) | 2023.03.03 |
| 06. html 태그_블록쿼터, abbr, address, 이미지 캡션 (0) | 2023.03.02 |
| 05. html 태그_텍스트 - 서식 (1) | 2023.03.02 |
| 04. html 태그_Style (0) | 2023.03.02 |
