CSS 스타일이 적용된 순서는 무엇입니까?

다음 HTML이 있습니다.CSS 스타일이 적용된 순서는 무엇입니까?

<ul> 
    <li> 
    <a>asdas</a> 
    </li> 
</ul>

제 CSS 스타일 시트에는 태그에 대한 일반 설정과 ul li에 대한 여러 hundered lines 설정이 있습니다. 블루 색상으로로드하고, 이후 오버라이드 (override)됩니다 : : 이것처럼 : 첫번째 색상이 있음을

a:link 
{ 
color: red; 
} 
... 
ul li a 
{ 
color:blue; 
}

방화범이 나에게 말한다,
빨간색은 지금까지 나는 항상 생각했습니다 그로드 CSS 파일과의 순서 단일 CSS 파일 내의 스타일 순서는 HTML 요소의 형식을 브라우저에 알려줍니다. 불행히도 나는 지금 그것을 경험하고있다.

그럼 내 안에있는 태그를 파란색으로 렌더링하고 빨간색으로 렌더링하지 않고 내 스타일을 수정해야합니다.

출처

2010-05-13 citronas

[외부 파일에서 충돌하는 두 가지 CSS 스타일의 사양 동작은 무엇입니까? 브라우저가 얼마나 잘 지원합니까?] (http://stackoverflow.com/questions/2819410/what-is-the-spec-behavior-for-two-conflicting-css-styles-from-an-external-file) – Quentin

스타일은 요소에 대해 가장 특정 인 스타일을 적용한 다음 동일한 특이성을 갖는 규칙에 대해 텍스트 순서로 적용됩니다. More here in the spec. a:link은 특정보다 많기 때문에 ul li a보다 스타일이 배치에 관계없이 우선합니다.

그럼 내 안에있는 태그가 파란색으로 렌더링되고 빨간색으로 렌더링되지 않도록하려면 어떻게해야합니까?

최소한 파란색 규칙을 빨간색 규칙처럼 지정하십시오. 이 경우에, 당신은 그것을 :link를 추가하여 해당 작업을 수행 할 수 있습니다

이

ul li a:link 
{ 
    color:blue; 
}

출처

2010-05-13 11:36:09

실제 이유는'a : link'가'ul li a'보다 더 구체적이라는 것입니다. – Quentin

@ David : 아주! 그래, 나는 그 시작을 좀 잊어 버렸지, 그렇지? 결정된. –

이 답변은 실제로 질문에 대답하지 않습니다. "li에서 파란색으로 렌더링되고 빨간색으로 렌더링되지 않는 태그를 얻으려면 내 스타일을 어떻게 수정해야합니까?" –

내가 여기

출처

2010-05-13 11:36:16 ant

두 가지 문제가 있습니다. 첫째, 문법이 잘못되었습니다 (중요한 단어 앞에 강타가옵니다). 둘째, 그것은 쇠망 치는 접근법이며 다시 돌아올 수 없습니다. 캐스케이드에 넣으려는 세 번째 스타일이 있다면 중요한 것은 그것을 넘어 뜨릴 것입니다. – Quentin

@David Dorward 고맙습니다. 제가 고치 셨습니다.나는 단지 그의 질문에 대답하고 있었다. "그럼 말해봐, 리가 아닌 청색과 적색으로 태그를 만들기 위해 어떻게 내 스타일을 고쳐야 만 할까?"나는 그렇지 않았다. 그는 제 3의 스타일에 대해서는 아무 말도하지 않았다. 지금 : D 아주 못 생겼어. 동의 해.하지만 그의 질문에 대답 해. – ant

downvoteer가 왜 downvote인지, 문법 오류를 수정했는지, 또 내가 고쳐야 할 것이 있는지/설명 할 수 있는지 말해 줄 수 있나? – ant

color:blue !important; 좋아 보인다 CSS 선택기의 특이성에 대한 기사의 사용하십시오 : http://www.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

의 섹션 특이성을 측정하는 방법?

a:link => one tag (a) + one pseudo-class (:link) = 1 + 10 = 11 points ul li a: => three tags (ul, li, a) = 1 + 1 + 1 = 3 points
그래서

는 A : 링크 스타일의 승리 당신에게 대답을 제공합니다.

힌트 : CSS 파일의 순서는 두 개의 CSS 선택기가 동일한 특이성을 가질 때만 중요합니다.

출처

2010-05-13 11:38:40 Douglas

CSS 스타일이 적용된 순서는 무엇입니까?

답변

관련 문제