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"/>답변
