상속

CSS

상속

Made Project 2021. 1. 18. 23:15

<!DOCTYPE html>
<html>
  <head>
    <style>
      li{color:red;}
      #idsel{color:blue;}
      #idsel{color:yellow;}
      .classsel{color:green;}
    </style>
  </head>
  <body>
    <ul>
      <li>html</li>
      <li id="idsel" class="classsel">css</li>
      <li>javascript</li>
    </ul>
    <ol>
      <li>style attribute</li>
      <li>id selector</li>
      <li>class selector</li>
      <li>tag selector</li>
    </ol>
  </body>
</html>

우선순위

1.style attribute (태그에 가깝고 더 구체적이다.)

2.id selector (특정 아이디만 선택할수 있기 때문에 중복안됨

3.class selector (원하는 태그를 정할수 있기 때문에)

4.tag selector (포괄적이기 때문에)

구체적일수록 우선 순위가 높다.

li{color:red !important;} 우선순위가 제일 높아진다.
      #idsel{color:blue;}
      #idsel{color:yellow;}
      .classsel{color:green;}

이 글은은 생활코딩을 참고하여 포스팅 하였습니다. egoing님 감사합니다.