선택자

선택자는 HTML의 특정한 요소를 선택하는 사인(sign)이다.

 

 

1. 태그로 찾기

선택자를 입력하는 부분에 적용하려는(찾으려는) 태그의 이름을 입력한다.

 h1{
    color : red;
    }
p{
    color : blue;
    }
       

선택자를 작성하는곳에 아무런 기호 없이 우리가 알고 있는 태그의 이름만 작성하는것을 통해서 "태그들"을 찾을 수 있다. 하지만 문제는 예를들어 수많은 div가 있는데 우리가 원하는 특정 일부 div를 찾아내는데 무리가 있다. 

 

 

 

2. 클래스로 찾기

좀 더 명확하게 원하는 요소를 찾기 위해서 '클래스 선택자'라는 것이 존재한다.

 .title{
   color : red;
        }
 .main-text {
    color : blue;
        }

"."은 클래스 선택자라고 한다. title이라는 태그를 찾는것이 아니라 즉, title이라는 클래스를 가지고 있는 요소를 찾아서 글자 색상을 빨간색으로 적용한다는 뜻이다.

 

<h1 class = "title">제목</h1>     //class라는 HTML 속성에 원하는 별명을 입력한다.
<h2>제목2</h2>
<p class = "main-text">본문</p>   //제목에서 title을 본문에서는 main-text라는 별명을 지정했다.
<p>본문2</p>