CSS에서 !important 사용 방법 요약

다음은 CSS에서 더 중요한 !중요한 속성 중 하나에 대한 간략한 소개입니다. 다음 두 가지 사항은 저자의 사례를 요약한 것입니다.

1. IE가 특정 CSS 사양에서 벗어나는 상황을 해결하는 데 사용됩니다. 예 IE의 효과는 Firefox, Opera 등의 다른 브라우저와 항상 2px 다르기 때문에 페이지 레이아웃이 잘못 정렬됩니다. 이는 IE의 상자 간 거리 해석 버그로 인해 발생합니다. !important를 사용하여 문제를 해결하세요.

예를 들어 다음 스타일

.myclass{
 margin-left:20px!important;
 margin-left:40px;

}

Firefox, Opera 및 Chrome에 있는 경우 이러한 브라우저는 !important 속성을 지원합니다. 즉, margin-left:20px!important 문이 기본적으로 적용됩니다. , 다음은 !important로 선언된 스타일이 이를 재정의하지 않습니다. 즉, 가장 높은 수준을 가지며 아래의 누구도 나를 대체할 수 없습니다!

그런데 IE 브라우저로 전환하면 어떻게 될까요? IE는 !important를 지원하지 않기 때문에 IE는 이 문장의 의미를 모른다는 뜻이므로 멍청한 IE는 이 항목을 건너뛰었고 다음은 기사를 알고 있었기 때문에 여백을 두었습니다. -left:40px;

이 적용되었습니다.

이 말에서 한 가지 주의할 점은 다음과 같습니다.

IE가 실제로 !important를 모른다는 의미는 아닙니다. IE를 다른 브라우저와 구별하기 위해 !important만 사용하려는 경우 다음과 같이 잘못된 것입니다.

.myclass{
backgroud-color:black !important;
}

us 저는 기발하게도 이 스타일이 IE에서는 인식되지 않지만 다른 브라우저에서 표시되도록 사용자 정의할 수 있다고 생각했습니다. 정말 그렇습니까? 설마! IE도 이를 인식했습니다.

이 시점에서 조금 혼란스러우신가요? IE가 인식하나요? ? ?

답은 매우 간단합니다. 다음과 같이 이름이 같은 두 스타일이 동시에 나타날 때만 사용할 수 있습니다.

.myclass{
 margin-left:20px!important;
 margin-left:40px;

}

2. 글꼴 크기와 같이 스타일 A가 정의되어 있으면 앞으로는 이 글꼴 크기를 덮어쓰기 위해 스타일 A라고도 합니다. 또한 !important를 사용할 수도 있습니다. 그리고 새 스타일도 !important를 사용하면 강제로 덮어쓰게 됩니다

rree

동일한 이름을 가진 스타일이어야 합니다. 즉, 스타일 이름은 A라는 스타일이 작동합니다. 예를 들어

.A{
 font-size:12px !important;
}
.A{
 font-size:14px;   //不会生效
}

.A{
 font-size:14px !important; //生效
}

에서는 작동하지 않습니다. 이 경우 자식의 글꼴 크기는 14px이며 아버지의 영향을 받지 않습니다.

위 내용은 CSS에서 !important 사용 방법 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!