CSS "and"및 "or"

CSS "and"및 "or"

---

일부 입력 유형을 스타일링하여 분석해야하기 때문에 상당히 큰 문제가 있습니다. 나는 다음과 같은 것을 가지고 있었다.

.registration_form_right input:not([type="radio")
{
 //Nah.
}

하지만 체크 박스에 스타일을 지정하고 싶지도 않습니다.

난 노력 했어:

.registration_form_right input:not([type="radio" && type="checkbox"])
.registration_form_right input:not([type="radio" && "checkbox"])
.registration_form_right input:not([type="radio") && .registration_form_right input:not(type="checkbox"])

사용하는 방법 &&? 그리고 ||조만간 사용해야하는데 사용법도 같을 것 같아요.

업데이트 :
난 아직도 사용하는 방법을 알고하지 않습니다 ||및 &&올바르게. W3 문서에서 아무것도 찾을 수 없습니다.

---

&& 여러 선택기를 함께 묶어 작동합니다.

<div class="class1 class2"></div>

div.class1.class2
{
  /* foo */
}

다른 예시:

<input type="radio" class="class1" />

input[type="radio"].class1
{
  /* foo */
}

|| 여러 선택기를 쉼표로 구분하여 작동합니다.

<div class="class1"></div>
<div class="class2"></div>

div.class1,
div.class2
{
  /* foo */
}

---

그리고 ( &&) :

.registration_form_right input:not([type="radio"]):not([type="checkbox"])

또는 ( ||) :

.registration_form_right input:not([type="radio"]), 
   .registration_form_right input:not([type="checkbox"])

---

요소 의 속성 aAND 를 선택하려면 :bX

X[a][b]

요소 의 속성 a또는 속성을 선택하려면 :bX

X[a],X[b]

---

The :not pseudo-class is not supported by IE. I'd got for something like this instead:

.registration_form_right input[type="text"],
.registration_form_right input[type="password"],
.registration_form_right input[type="submit"],
.registration_form_right input[type="button"] {
  ...
}

Some duplication there, but it's a small price to pay for higher compatibility.

---

Just in case if any one is stuck like me. After going though the post and some hit and trial this worked for me.

input:not([type="checkbox"])input:not([type="radio"])

---

I guess you hate to write more selectors and divide them by a comma?

.registration_form_right input:not([type="radio"]),  
.registration_form_right input:not([type="checkbox"])  
{  
}

and BTW this

not([type="radio" && type="checkbox"])  

looks to me more like "input which does not have both these types" :)

---

You can somehow reproduce the behavior of "OR" using & and :not.

SomeElement.SomeClass [data-statement="things are getting more complex"]  :not(:not(A):not(B))     {
    /* things aren't so complex for A or B */
}

참고URL : https://stackoverflow.com/questions/2797091/css-and-and-or