html_study/b.html at main · northeast23/html_study · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="a.css">
    <style>
    /* body 폰트 사이즈와 비교해보기  */

    /* body{font-size: 10px;} */

    .one{
        color: red;
        font-size: 32px;
        font-weight: 900;
    }

    .two{
        font-size: 20px;
    }

    .three{
        color: green;
        font-size: 2em;
    }
    .four{
        font-size: 3rem;
    }
    .five{
        /* width: 500px;  */
        /* 아래는 50 viewport width */
        width: 50vw;
    }
    </style>
</head>
<body>
    <!-- 이 이상의 선택자에 대해서는 요약강좌에서 하지 않음 -->
    <h1 class="one two">hello</h1>
    <h1 class="two">hello</h1>
    <h1 class="three">hello</h1>
    <!--
        1. 추가 공부할 선택자 링크 : https://developer.mozilla.org/ko/docs/Web/CSS/CSS_Selectors
        2. 추가 공부할 속성 링크 : https://developer.mozilla.org/ko/docs/Web/CSS/Reference
    -->
    <div class="four">hiehsadPSODgjsldg</div>
    <div class="five">hiehsadPSODgjsldg</div>
    <div>hiehsadPSODgjsldg</div>
</body>
</html>