CSS에서! important 속성을 사용하는 경우

CSS에서! important 속성을 사용하는 경우 [중복]

---

이 질문에 이미 답변이 있습니다.

• CSS에서 "! important"를 사용하면 어떤 의미가 있습니까? 9 답변

치다:

#div p {
    color: red !important;
}
...
#div p {
    color: blue;
}

어떻게 !important작동 하는지 이해합니다 . 이 경우 div는 이제 우선 순위 ( !important)를 갖기 때문에 빨간색으로 렌더링됩니다 . 그러나 나는 그것을 사용하기에 적절한 상황을 여전히 파악할 수 없습니다. !important하루를 절약 하는 예가 있습니까?

---

이것은 실제 시나리오입니다.

이 시나리오를 상상 해보세요

1. 사이트의 시각적 측면을 전역 적으로 설정하는 전역 CSS 파일이 있습니다.
2. 당신 (또는 다른 사람들)은 일반적으로 매우 나쁜 습관 인 요소 자체에 인라인 스타일을 사용 합니다.

이 경우 전역 CSS 파일의 특정 스타일을 중요하게 설정하여 요소에 직접 설정된 인라인 스타일을 재정의 할 수 있습니다.

실제 실제 사례?

이러한 종류의 시나리오는 일반적으로 HTML을 완전히 제어 할 수 없을 때 발생합니다. 예를 들어 SharePoint 의 솔루션을 생각해보십시오 . 파트를 전역 적으로 정의 (스타일 지정)하고 싶지만 제어 할 수없는 일부 인라인 스타일이 있습니다. !important이러한 상황을보다 쉽게 ​​처리 할 수 ​​있습니다.

다른 실제 시나리오에는 인라인 스타일도 사용하는 잘못 작성된 jQuery 플러그인 도 포함 됩니다.

나는 당신이 지금 쯤 아이디어를 얻었다 고 생각하고 다른 것 또한 생각 해낼 수 있습니다.

언제 사용하기로 결정 !important했습니까?

!important다른 방법으로 할 수없는 경우 가 아니면 사용 하지 않는 것이 좋습니다 . 피할 수있을 때마다 피하십시오. 많은 !important스타일을 사용하면 스타일 시트 의 자연스러운 계단식 이 깨지기 때문에 유지 관리가 조금 더 어려워집니다 .

---

스타일 속성 덮어 쓰기

HTML 소스 코드는 변경할 수 없지만 스타일 시트 만 제공한다고 예를 들어 설명합니다. 어떤 생각없는 사람이 요소에 직접 스타일을 적용했습니다 (boo!)

       div { background-color: green !important }

    <div style="background-color:red">
    <p>Take that!</p>
    </div>

여기서! important는 인라인 CSS를 재정의 할 수 있습니다.

---

이것은이다 실제 , 실제 생활 이 실제로 어제 무슨 일이 있었 있기 때문에, 시나리오 :

• jQuery 대화 상자의 Z- 색인. 자동 제안 목록이 제대로 표시되지 않음

!important내 대답에 사용하지 않는 대안 은 다음과 같습니다.

• 특정 애매한 속성이 적용되는 JavaScript / CSS에서 사냥.
• JavaScript로 속성을 추가하는 것은 !important.

따라서의 장점은 !important때때로 시간을 절약한다는 것입니다. 이렇게 아주 드물게 사용한다면 유용한 도구가 될 수 있습니다.

특이성이 작동 하는 방식을 이해하지 못하기 때문에 사용 하는 경우 잘못하고있는 것입니다.

---

에 대한 또 다른 용도 !important는 일종의 외부 위젯 유형을 작성하고 스타일이 적용된 스타일인지 확인하려는 경우입니다. 다음을 참조하십시오.

• 추가 된 컨트롤의 CSS

---

CSS 선택기의 특이성을 높이기위한 다른 방법이 부족할 때 일반적으로! important를 사용합니다.

따라서 다른 CSS 규칙이 이미 ID, 상속 경로 및 클래스 이름을 사용하여 해당 규칙을 재정의해야 할 때 '중요'를 사용해야합니다.

---

!important"style"속성을 사용하는 일부 JavaScript "플러그인"(광고, 배너 등)에 의해 생성 된 HTML 스타일을 덮어 써야 할 때 사용해야 합니다.

따라서 CSS를 제어하지 않을 때 사용할 수 있다고 생각합니다.

---

엄밀히 말하면 CSS를 잘 구성하고 특이성이 너무 많지 않다면! important를 사용할 필요가 없습니다.

! important를 사용하기에 가장 적절한시기는 사이트의 일반적인 캐스케이드 외부에서 스타일을 지정하려는 예외적 인 스타일이있을 때입니다.

---

!important is somewhat like eval. It isn't a good solution to any problem, and there are very few problems that can't be solved without it.

---

Using !important is generally not a good idea in the code itself, but it can be useful in various overrides.

I use Firefox and a dotjs plugin which essentially can run your own custom JS or CSS code on specified websites automatically.

Here's the code for it I use on Twitter that makes the tweet input field always stay on my screen no matter how far I scroll, and for the hyperlinks to always remain the same color.

a, a * {
  color: rgb(34, 136, 85) !important;  
}

.count-inner {
 color: white !important;   
}

.timeline-tweet-box {
 z-index: 99 !important;
position: fixed !important;
left: 5% !important;   
}

Since, thankfully, Twitter developers don't use !important properties much, I can use it to guarantee that the specified styles will be definitely overridden, because without !important they were not overridden sometimes. It really came in handy for me there.

---

The use of !important is very import in email creation when inline CSS is the correct answer. It is used in conjunction with @media to change the layout when viewing on different platforms. For instance the way the page looks on desktop as compare to smart phones (ie. change the link placement and size. have the whole page fit within a 480px width as apposed to 640px width.

---

This is a real-world example.

While working with GWT-Bootstrap V2, it will inject some CSS file, which will override my CSS styles. In order to make my properties to be not overridden, I used !important.

---

I'm using !important to change the style of an element on a SharePoint web part. The JavaScript code that builds the elements on the web part is buried many levels deep in the SharePoint inner-workings.

Attempting to find where the style is applied, and then attempting to modify it seems like a lot of wasted effort to me. Using the !important tag in a custom CSS file is much, much easier.

---

I am planning to use !important for a third-party widget meant to be embedded in a large number of websites out of my control.

I reached the conclusion !important is the only solution to protect the widget's stylesheet from the host stylesheet (apart from iframe and inline styles, which are equally bad). For instance, WordPress uses:

#left-area ul {
    list-style-type: disc;
    padding: 0 0 23px 16px;
    line-height: 26px;
}

This rule threathens to override any UL in my widget because id's have strong specificity. In that case, systematic use of !important seems to be one of the few solutions.

---

You use !important to override a css property.

For example, you have a control in ASP.NET and it renders a control with a background blue (in the HTML). You want to change it, and you don't have the source control so you attach a new CSS file and write the same selector and change the color and after it add !important.

Best practices is when you are branding / redesigning SharePoint sites, you use it a lot to override the default styles.

참고URL : https://stackoverflow.com/questions/5701149/when-to-use-the-important-property-in-css