2010-01-27 5 views
8

부울 조건을 사용하여 둘 이상의 CSS 선택기를 결합하는 방법이 있습니까? and, or, not? 두 개 이상의 CSS 선택기를 부울 조건으로 결합

<div>을 고려

:

<div class="message error"> 
    You have being logged out due too much activity. 
</div> 

내가 예를 들어 클래스를 모두 포함 요소 만 선택할 수 있을까요?

div.message && div.error의 행을 따라 뭔가가 있습니까?

+0

어디에서 선택 하시겠습니까? Javascript에서 (lib?를 사용하여) 또는 스타일 시트 또는 다른 언어로? – beggs

+0

이러한 선택기는 스타일 시트에 포함됩니다. – Anurag

+1

질문에 이미 답변이 제대로되어 있지만, 이중 클래스 선택기는 친애하는 친구 IE6에서 작동하지 않습니다. – adamJLev

답변

13

이 작동합니다 :

&& = div.message.error {} 
|| = div.message, div.error {} 

당신은 "없다"

편집을 할 수 있다고 생각하지 마십시오 : 그냥 확인하기 위해 빠른 테스트를했다 :

<html> 
    <head> 
     <style type="text/css"> 
      div.error.message { 
       background-color: red; 
      } 
      div.message, div.error { 
       border: 1px solid green; 
      } 
     </style> 
    </head> 
    <body> 
     <div>None</div> 
     <div class="error">Error</div> 
     <div class="message">Message</div> 
     <div class="error message">Error Message</div> 
    </body> 
</html> 

"메시지" , "error"및 "error message"div는 모두 녹색 테두리를 가지며 "error message"div 만 빨간색 배경을 갖습니다.

+1

완벽한 ..'not'는 큰 걱정이 아니고,'and'와'or'만이 있습니다. 우리는 여기에 혀를 트위스터를 가지고 있습니다. :) 자세한 예제는 고마워요. – Anurag

+0

그레이트 솔루션. 궁금한 점은 CSS 사양 등 어디서나 공식적으로 문서화 된 솔루션입니까? 참조 할 때 유용합니다. – David

5

시도 div.message.error.

+2

... 그 "나는"믿습니다. "또는"의 경우 각 클래스와 함께 줄을 간단히 반복 할 수 있습니다. – Jay

+0

나는 그것을 짐작할 수 없었다. 고마워요! – Anurag

관련 문제