!important,::after,::before


!important


重要度を述べる.
1.!important 달린게 적용
<style>
.hz{color: red !important;}
.hz {color: blue;}
</style>
 
<p class="hz">홈짱닷컴 (homzzang.com)</p>
// red

2.나중께 적용(하향식)
<style>
.hz {color: red !important;}
.hz {color: blue;}
.hz {color: green  !important;}
</style>

<p class="hz">홈짱닷컴 (homzzang.com)</p>
// green

3. !important 다수 시, 명시도 다른 경우
* 명시도 높은게 적용
<style>
div .hz {color: red !important;}
.hz {color: blue;}
.hz {color: green !important;}
</style>
<div>
    <p class="hz">홈짱닷컴 (homzzang.com)</p>
</div>
//red

::after, ::before

<q>Some quotes,</q> he said, <q>are better than none.</q>

q::before {
  content: "«";
  color: blue;
}

q::after {
  content: "»";
  color: red;
}

//::beforeはマークの前半です.
//::afterはラベルの後ろに貼り付けられています.