html - cssスタイルで*をオーバーライドする

Question

私のcssスタイルシート：

 * {vertical-align:top;}  
input.test {vertical-align:middle;}

これは私のhtmlコードの例です：

<input class="test" /><input class="test" />

だから私はクラステストをオーバーライドしたい*
私は試しました：

* {vertical-align:top;}
input.test {vertical-align:middle!important;}

しかし、Firefoxでは機能せず、vertical-alignはまだ上にあります...
ありがとうございます！

Answer 1

...しかし、残念ながら、要素vertical-alignに適用されるプロパティではありません。input

!importantこのコンテキストでは、違いはありません。
input.test、実際、すでにオーバーライドされています*

どうして？これはより具体的なセレクターであり、CSS はすべてセレクターの特異性に関するものです。
つまり、最も具体的なセレクターを持つルールが優先されます。

inputしたがって、その要素の外観に影響を与えるには、tdそれを含むセルをターゲットにしてその vertical-align値を設定する必要があります。