CSS가 같지 않음 선택기가 있습니까?

CSS에! = (같지 않음)과 같은 것이 있습니까? 예를 들어, 다음 코드가 있습니다.

input {
 ... 
 ...
}

그러나 일부 입력의 경우 이것을 무효화해야합니다. 입력 태그에 "reset"클래스를 추가하여이를 수행하고 싶습니다.

<input class="reset" ... />

그런 다음 CSS에서이 태그를 건너 뜁니다.

어떻게 할 수 있습니까?

내가 볼 수있는 유일한 방법은 입력 태그에 클래스를 추가하고 다음과 같이 CSS를 다시 작성하는 것입니다.

input.mod {
 ...
 ...
}

CSS3에서는 사용할 수있는 :not()필터를, 그래서 당신이 무슨 일을하는지 알고 있어야 할 수 있지만 모든 브라우저가 아직 완전히 CSS3를 지원 해주기되는 모든 주요 브라우저에서 지원 이가이다 (그리고 꽤 많은 시간 동안왔다 된 대답 ...).

예:

<input type="text" value="will be matched" />
<input type="text" value="will not be matched" class="avoidme" />
<input type="text" value="will be matched" />

및 CSS

input:not(.avoidme) { background-color: green; }

참고 : 이 해결 방법은 더 이상 필요하지 않습니다. 나는 맥락을 위해 여기에 남겨 둘 것입니다.

CSS3를 사용하지 않으려면 모든 요소에 스타일을 설정 한 다음 클래스로 재설정 할 수 있습니다.

input { background-color: green; }
input.avoidme { background-color: white; }

CSS에서만 재설정 클래스의 변경 사항을 '되돌리기'하여이를 수행 할 수도 있습니다.

INPUT { 
    padding: 0px;
}
INPUT.reset {
    padding: 4px;
}

CSS3에는 :not()이 있지만 아직 모든 브라우저에서 구현되지는 않았습니다. 그러나 IE9 플랫폼 미리보기에서 구현됩니다.

input:not(.reset) { }

http://www.w3.org/TR/css3-selectors/#negation

그 동안에는 구식 방법을 고수해야합니다.

다음과 같은 속성을 타겟팅하여 접근 할 수도 있습니다.

input:not([type=checkbox]){ width:100%; }

이 경우 '체크 박스'유형이 아닌 모든 입력의 너비는 100 %입니다.

흥미로운 것은 JQuery를 사용하여 DOM 요소를 선택하기 위해 이것을 시도했으며 작동합니다! :)

$("input[class!='bad_class']");

이 페이지에는 'comment-copy'클래스가없는 168 개의 div가 있습니다.

$("div[class!='comment-copy']").length => 168
$("div[class!='.comment-copy']").length => 168

class = "reset"대신 class = "valid"를 사용하여 논리를 뒤집을 수 있습니다. 기본적으로 이것을 추가하고 클래스를 제거하여 스타일을 재설정 할 수 있습니다.

그래서 당신의 모범과 토마스에서

input.valid {
 ... 
 ...
}

과

<input type="text" value="will be matched" class="valid"/>
<input type="text" value="will not be matched" />
<input type="text" value="will be matched" class="valid"/>