web-dev-qa-db-ja.com

Css擬似クラスinput：not（disabled）not：[type = "submit"]：focus

私はinputs要素にいくつかのcssを適用し、無効化されておらず送信タイプではない入力のみにそれを行いたい、cssが機能していない、おそらく誰かが私にこれを追加する方法を説明できるなら.

input:not(disabled)not:[type="submit"]:focus{
box-shadow:0 0 2px 0 #0066FF;
-webkit-box-shadow:0 0 4px 0 #66A3FF;
}
csscss-selectorspseudo-class
113
BurebistaRuler

の代わりに：

input:not(disabled)not:[type="submit"]:focus {}

つかいます：

input:not([disabled]):not([type="submit"]):focus {}

disabledは属性であるため、角かっこが必要であり、:not()セレクターでコロンと括弧が混在している/欠落しているようです。

デモ： http://jsfiddle.net/HSKPx/

注意すべき点が1つあります。私は間違っているかもしれませんが、disabled入力は通常フォーカスを受け取ることができないため、その部分は冗長になる可能性があります。

または、:enabledを使用します

input:enabled:not([type="submit"]):focus { /* styles here */ }

繰り返しますが、無効な入力がフォーカスを受け取ることができる場合は考えられないので、不要なようです。

234
Wesley Murch

あなたの構文はかなり厄介です。

これを変更：

input:not(disabled)not:[type="submit"]:focus{

に：

input:not(:disabled):not([type="submit"]):focus{

:enabledと:disabledが有効なCSSセレクターであることに気付いていない人が多いようです...

15
Gavin

あなたの選択にはいくつかのタイプミスがあります。 input:not([disabled]):not([type="submit"]):focusである必要があります

概念実証については、これを参照してください jsFiddle 補足として、「background-color」プロパティを削除すると、ボックスの影が機能しなくなります。理由はわかりません。

7
PatrikAkerstrand