2011-11-11 1 views
4

난 워드 프레스에 대한 사용자 정의 테마를 구축하고 기본 2,010있는 style.css 파일에 이것을보고 해요 :CSS : 이중 선언은 무엇을합니까?

#wrapper { 
    margin: 0 auto; 
    width: 940px; 
} 
#wrapper { 
    background: pink; 
    margin-top: 20px; 
    padding: 0 20px; 
} 

지금이합니다 (pink 제외) 기본 코드입니다. 논리적 인 것처럼 보이기 위해 노력하고 붕괴 시키면 꽤 다른 점이 있습니다.

내가 알아낼 수없는 것은 왜 같은 요소를 두 번 선언하겠습니까? 나는 전에 그것을 본 적이 없다 ...

WR!

답변

4

여러 요소에서 공유 속성을 적용하려는 경우 유용합니다. 여러 소스에서 CSS :

#head, #foot { 
    height: 100px; 
} 
#foot { /*Another foot*/ 
    color: red; 
} 

두 번째 예 : 또 다른 유용한 응용 프로그램은 여러 소스에서
예를 스타일 시트를 추가

/* External stylesheet: common.css */ 
body { 
    background: yellow; 
} 
/* Inline stylesheet, overrides external stylehseet */ 
body { 
    background: pink; 
} 

두 가지 속성이 같은 특이성을 가지고

에서, 마지막 선언 속성이 적용됩니다.

+0

이 글은 이미 알고 있습니다. 위의 내용은 SAME 파일에서 나온 것입니다. 실제로 당신이 이미 보았던 어떤 것으로 가정하지 않고 질문을 읽으십시오. – WhiteRau

+0

@WhiteRau 다음은 몇 가지 예입니다. ID가 두 개인 이유는 여러 가지가 있습니다. 개발자는 선택기가 이미 있는지 여부를 보지 않고 CSS를 추가했습니다. 2. 선택기는 원래 다른 파일에 있었지만 파일을 병합 한 후에 선택기가 두 번 나타났습니다. 3. 원래 래핑 된 선택기 중 하나는 # 싸개. 개발자는 # 나머지를 제거하기로 결정하고 "#wrapper?"에 대한 검색 및 교체를 사용하여 두 개의 래퍼 선택기를 만들었습니다. 다른 세 가지 예제를 제공했습니다. 당신은 지금 더 잘 이해하고 있습니까? –

+0

나는이 문제가 매우 효과적으로 전달되고 있다고 생각하지 않습니다. 나는이 질문을 포기할 것이다. 나는 이미 호기심 때문에 -2 ... 그럴 가치가 없어. : P – WhiteRau

0

이전에 선언 된 속성을 무시합니다.

wrapper은 이제 오른쪽 상단 왼쪽 하단에 margin:20px auto 0 auto이됩니다.

+0

아니 다른 뭔가를하고 WP와 모든, 그들의 코드는 일반적으로 꽤 빡빡하므로 이중 선언은 이해가되지 않았다. 또한, 내가 말했듯이, 당신이 두 가지를 함께 시도하고 붕괴 시키면 완전히 다른 것이 발생합니다. 두 번째 작업이 모두 수행 중이면 첫 번째 작업보다 우선합니다. 아무것도 일어나지 않아야한다. 그러나 그것은 이해합니다. – WhiteRau

+0

http : // jsfiddle.net/nagxa/- 이것은 내가 말한 것입니다. 완전히 다른 일이 일어나고 있다면 CSS의 어딘가에 다른 일이 일어나야합니다. – motoxer4533

+0

나는 그것을 조사 할 것이다. 우리는 이것을 고려해 볼 것입니다. 점수를 꾸준히 떨어 뜨려도 답을 찾지 못할 수도 있습니다. 감사. – WhiteRau