2つの異なる入力タイプのCSSでグループセレクタを使用する方法

Question

ここでは、2種類の<input>タイプの「テキスト」と「パスワード」があり、両方に同じスタイルがあります。 グループ化の仕方は？

input[type=text] { 
    width: 100%; 
    padding: 12px; 
    border: 1px solid #ccc; 
    color : green; 
} 

input[type=password] { 
    width: 100%; 
    padding: 12px; 
    border: 1px solid #ccc; 
    color : green; 
} 

Answer 1

input[type=text], input[type=password] { 
    width: 100%; 
    padding: 12px; 
    border: 1px solid #ccc; 
    color : green; 
} 

詳細情報：http://www.htmldog.com/guides/css/intermediate/grouping/

Answer 2

それを行うには、いくつかの方法があります。単純なソリューションの1つは、次のように両方のInputタグにCSSクラスを配置することです。

<input type="text" class="formatter" /> 
<input type="password" class="formatter" /> 

次に、そのクラスのスタイルを次のように設定します。

input.formatter { 
    width: 100%; 
    padding: 12px; 
    border: 1px solid #ccc; 
    color : green; 
}