web-dev-qa-db-ja.com

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ドキュメントには何も見つかりませんでした。

csscss-selectorsconditional-operator
92
Misiur

&&は、次のような複数のセレクターをストリング化することで機能します。

<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 */
}
119
geofflee

AND（&&）：

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

または（||）：

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

a要素のプロパティb AND Xを選択するには：

X[a][b]

a要素のプロパティb OR Xを選択するには：

X[a],X[b]
13
waao

:not擬似クラスはIEではサポートされていません。私は代わりに次のようなものを手に入れました：

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

そこにはいくつかの重複がありますが、互換性を高めるために支払う代償はわずかです。

3
Max Shawabkeh

誰かが私のように立ち往生している場合に備えて。ポストといくつかのヒットとトライアルを通過した後、これは私のために働いた。

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

もっとセレクターを書いて、それらをコンマで区切るのは嫌だと思いますか？

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

ところでこれは

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

「これらのタイプの両方を持たない入力」のように私に見えます:)

0
Jaroslav Záruba

＆と：notを使用して、「OR」の動作を何らかの方法で再現できます。

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