외부 CSS를 사용하여 HTML의 인라인 스타일을 어떻게 재정의할 수 있습니까?

외부 CSS로 인라인 스타일 재정의

인라인 스타일이 포함된 HTML 마크업으로 작업할 때 이러한 스타일을 재정의해야 하는 상황이 발생할 수 있습니다. 외부 CSS를 사용하는 스타일. 그러나 일반 CSS 규칙을 적용하면 의도한 대로 작동하지 않을 수도 있습니다.

인라인 스타일을 효과적으로 재정의하려면 CSS 규칙에서 !important 키워드를 활용할 수 있습니다. 이 키워드는 규칙에 더 높은 우선순위를 추가하여 인라인 스타일이 있는 경우에도 적용되도록 합니다.

예를 들어 다음 HTML 마크업을 고려하세요.

<div>
<p> CSS 규칙을 사용하여 div 요소의 인라인 스타일을 재정의하려면:</p>
<pre class="brush:php;toolbar:false">div {
    color: blue;
}

인라인 스타일은 재정의되지 않습니다. 인라인 스타일을 덮어쓰려면 !important 키워드를 사용하세요.

div {
    color: blue !important;
}

규칙에 !important를 추가하면 인라인 스타일보다 우선순위가 높아집니다. 결과적으로 인라인 스타일이 명시적으로 색상을 빨간색으로 설정하더라도 div 요소 내의 텍스트는 이제 파란색으로 렌더링됩니다.