다음 div가있는 경우 :
<div class="sectionA" id="content">
Lorem Ipsum...
</div>
” id='content'
AND를 가진 div”라는 아이디어를 표현하는 스타일을 정의하는 방법이 class='myClass'
있습니까?
또는 단순히 다음과 같이 한 가지 또는 다른 방법으로 가셨습니까?
<div class="content-sectionA">
Lorem Ipsum...
</div>
또는
<div id="content-sectionA">
Lorem Ipsum...
</div>
답변
스타일 시트에서 :
div#content.myClass
편집 : 이것도 도움이 될 수 있습니다.
div#content.myClass.aSecondClass.aThirdClass /* Won't work in IE6, but valid */
div.firstClass.secondClass /* ditto */
그리고 당신의 예에 따라 :
div#content.sectionA
4 년 후 편집 : 이 기능은 매우 오래되어 사람들이 계속 찾아 냅니다. 선택기에서 tagNames를 사용 하지 마십시오 . tagName이 필요하지 않은 필터링 단계를 추가하기 때문에 #content.myClass
보다 빠릅니다 div#content.myClass
. 선택기에서만 tagNames를 사용해야합니다!
답변
차이가 있습니다 #header .callout
와 #header.callout
CSS에서이.
다음은 “일반 영어”입니다 #header .callout
.
클래스 이름 callout
이 ID 인 요소의 자손 인 모든 요소를 선택하십시오 header
.
그리고 #header.callout
의미 :
ID header
와 클래스 이름 을 가진 요소를 선택하십시오 callout
.
CSS 트릭을 더 읽을 수 있습니다.
답변
하나의 요소에 ID와 클래스를 결합하는 데 아무런 문제가 없지만 하나의 규칙에 대해 둘 다로 식별 할 필요는 없습니다. 정말로 원한다면 할 수 있습니다 :
#content.sectionA{some rules}
div
다른 사람들이 제안한 것처럼 ID 앞에는 필요하지 않습니다 .
일반적으로 해당 요소에 고유 한 CSS 규칙은 ID로 설정해야하며 규칙보다 클래스의 가중치가 더 높습니다. 클래스에 의해 지정된 규칙은 조정해야 할 때마다 여러 곳에서 변경하지 않으려는 여러 항목에 적용되는 속성입니다.
이것으로 요약됩니다.
.sectionA{some general rules here}
#content{specific rules, and overrides for things in .sectionA}
말이 되나요?
답변
id는 항상 고유하기 때문에 일반적으로 id로 지정된 요소를 분류 할 필요는 없지만 실제로 필요한 경우 다음이 작동해야합니다.
div#content.sectionA {
/* ... */
}
답변
당신은 할 수 있습니다 CSS의 ID 및 클래스를 결합하지만 ID는 그래서 그것을 넘어서 자격을 것 CSS 셀렉터에 클래스를 추가, 고유하기위한 것입니다.
답변
사용 : tag.id ; tag#class
당신의 CSS에서 태그 변수.
답변
ID는 문서 전체에 걸쳐 고유해야하므로 둘 다를 기준으로 선택할 필요는 없습니다. 요소를 여러 클래스에 할당 할 수 있습니다.class="class1 class2"