blueprint css에서 div.class와 class를 같은 스타일로 정의하는 이유는 무엇입니까?

Question

청사진 CSS 프레임 워크의 링크 된 코드에는 div.class 선택기와 .class 선택기에 대해 정의 된 스타일이 있습니다. 이것은 중복되지 않습니까? 아니면 두 개의 선택자를 사용하여 클래스를 정의하는 미묘한 이유가 있습니까?

https://github.com/joshuaclayton/blueprint-css/blob/master/blueprint/src/grid.css (선 229-235)

/* In case you need to add a gutter above/below an element */ 
div.prepend-top, .prepend-top { 
    margin-top:1.5em; 
} 
div.append-bottom, .append-bottom { 
    margin-bottom:1.5em; 
} 

Answer 1

흥미로운 질문입니다. 저는 청사진을 사용하지 않았지만, div.prepend-top또는.prepend-top 중 하나를 무시하도록 선택하면 해당 선택 도구의 스타일 만 재정의됩니다.

이 일을 의미

:

.prepend-top { margin-top: 1em; } 

은 영향을받지 클래스 (여전히 1.5 EM 상단 여백)와 <div> 초 동안 스타일을 떠나, div.prepend-top는 대한 우선합니다 때문에보다 구체적인 선택하고 있기 때문에 <div> 요소.

그리고이 일을

:

div.prepend-top { margin-top: 1em; } 

때문에 div 유형 선택의 영향을받지 클래스와 다른 요소의 스타일을 떠날 것이다. 마찬가지로 append-bottom 클래스의 경우

다시 한 번 청사진을 사용하지 않았지만 HTML이 어떻게 구성 될 것으로 기대하는지와 관련이 있다고 생각합니다.