• 코드:
​x
 
1
<!DOCTYPE html>
2
<html lang="ko">
3
​
4
<head>
5
    <meta charset="UTF-8">
6
    <title>CSS3 Colors</title>
7
    <style>
8
        body {
9
            background-image: url("/examples/images/img_check_pattern.png");
10
            color: white;
11
        }
12
        #header_01 {background-color: hsla(0, 100%, 50%, 0);}
13
        #header_02 {background-color: hsla(0, 100%, 50%, 0.2);}
14
        #header_03 {background-color: hsla(0, 100%, 50%, 0.4);}
15
        #header_04 {background-color: hsla(0, 100%, 50%, 0.6);}
16
        #header_05 {background-color: hsla(0, 100%, 50%, 0.8);}
17
        #header_06 {background-color: hsla(0, 100%, 50%, 1);}
18
    </style>
19
</head>
20
​
21
<body>
22
​
23
    <h1 id="header_01">HSLA 색상값으로 표현된 빨간색 : 알파 값 0.0</h1>
24
    <h1 id="header_02">HSLA 색상값으로 표현된 빨간색 : 알파 값 0.2</h1>
25
    <h1 id="header_03">HSLA 색상값으로 표현된 빨간색 : 알파 값 0.4</h1>
26
    <h1 id="header_04">HSLA 색상값으로 표현된 빨간색 : 알파 값 0.6</h1>
27
    <h1 id="header_05">HSLA 색상값으로 표현된 빨간색 : 알파 값 0.8</h1>
28
    <h1 id="header_06">HSLA 색상값으로 표현된 빨간색 : 알파 값 1.0</h1>
29
​
30
</body>
31
​
32
</html>