11.CSS 기초 : 선택자

하나만 콕 집어서 style을 바꾸고 싶다면?

선택자를 사용하자! id="어쩌구저쩌구"
id의 style을 바꿀 때는 id이름 앞에 #를 붙이자. #first{...}

<style>
    .js{
      font-weight: bold;
      color:red;
    }
    #first{
      color:green;
    }
  </style>
...
<span id="first" class="js">JavaScript</span>

id가 first인 JavaScript부분은 CSS에 의해 초록색으로 변경되었다!

🤔 : 아니 왜요?

왜냐하면 id의 우선순위는 class보다 높기 때문이다. class는 id보다 포괄적이다.

🤔 : 클래스까지 지정해놓고 이 짓은 왜 할까?...

한가지 요소만 콕 집어서 style을 바꾸고 싶을 때가 있기 때문이다.

어떤 태그에 둘러싸여 있는 부분의 style을 바꾸고 싶다면?

<style>
    .js{
      ...
    }
    #first{
      ...
    }
    span{
      color:blue;
    }
  </style>

이제 span 태그로 둘러싸인 부분의 텍스트 색은 파란색으로 변경되었다!

태그의 스타일을 바꿀 때는 .이나 #은 필요없다.