HTMLCSSJS/BasicSelecter.html at master · NterChoi/HTMLCSSJS · 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
50
51
52
53
54
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>5.1 기본 선택자 사용하기</title>
    <style>
        *{
            color: blue;
        }
        p {
            font-size: 24px;
        }
        #title{
            color: #000;
        }
        .pink{
            color: pink;
        }
        .silver{
            color: silver;
        }
        a[href]{
            color: blueviolet;
        }
        a[target="_blank"]{
            display: block;

        }
    </style>
</head>
<body>
    <h1>전체 선택자 *</h1>
    <p>전체 선택자는 모든 요소를 한 번에 선택할 수 있습니다.</p>
    <h1>태그 선택자</h1>
    <p>
        태그 선택자는 태그명과 일치하는 태그를 모두 선택합니다.
    </p>
    <p>
        따라서 모든 p 태그의 텍스트 색상은 파란색이 됩니다.
    </p>
    <h1 id="title">아이디 선택자</h1>
    <p>아이디 선택자는 id 속성값을 이용해서 선택자를 지정하는 방법입니다.</p>
    <p>아이디 속성값은 고유해야합니다.</p>

    <h1 class="pink">클래스 선택자</h1>
    <p class="silver">class 속성값으로 선택자를 지정합니다.</p>
    <p class="silver"> class 속성값은 id 속성과 다르게 속성값을 중복해서 사용할 수 있습니다.</p>
    <a href="#">기본 a 태그</a>
    <a href="#" target="_blank">새 창으로 열리는 a 태그</a>


</body>
</html>