본문 바로가기
웹(Web)/CSS

선택자의 종류

by 지하생활자 2021. 4. 15.

선택자의 종류에는

태그 선택자
클래스 선택자
아이디 선택자가 있다

id는 html의 문법 select는 html의 속성값

 

 

<!DOCTYPE html>
<html>
  <head>
    <style>
      li{color:red;text-decoration:underline;}
      #select{font-size:100px}
    </style>
  </head>
    <body>
      <ul>
        <li>HTML</li>
        <li id="select">CSS</li>
        <li>JavaScript</li>
      </ul>
    </body>
</html>

 

class 선택자는 어떤 대상을 관리하기 쉽도록 그룹핑하는 것이고
#을 쓰는 select와는 달리 .을 쓴다
id 선택자는 한번만 쓸 수 있으며 class 선택자는 다른 태그에 여러번 쓸 수 있다

 

 

 

<!DOCTYPE html>
<html>
  <head>
    <style>
      li{color:red;text-decoration:underline;}
      #select{font-size:100px}
      .deactive{text-decoration:line-through;}
    </style>
  </head>
    <body>
      <h1 class="deactive">수업의 순서</h1>
      <ul>
        <li class="deactive">HTML</li>
        <li id="select">CSS</li>
        <li class="deactive">JavaScript</li>
      </ul>
    </body>
</html>

 

'웹(Web) > CSS' 카테고리의 다른 글

선택자 공부 팁  (0) 2021.04.15
부모 자식 선택자  (0) 2021.04.15
선택자와 선언  (0) 2021.04.15
선택자  (0) 2021.04.15
HTML과 CSS가 만나는 법  (0) 2021.04.15

댓글