type = "value"以外のすべての入力を選択するにはどうすればよいですか？

Question

私はフォームを持っていますが、テキストボックスをグレーアウトしたいのですが、それを行う際に、「送信」タイプのテキストも明るいグレーになります。だから私はタイプが "提出"と等しくないすべての入力に対してCSSを作ることに決めましたが、私はそれを行うことに問題があります。 「submit」を含むすべての入力を選択したい場合は、input[type*="submit"]を使用し、特定の要素を選択しない構文は:not(attribute)ですが、input[type:not("submit")のように実装する方法はわかりません。属性セレクタと:not()セレクタを使用して

input { 
 
    color: #666; 
 
} 
 
input[type*="submit"]{ 
 
    color: #000; 
 
}

<div class="modal-content"> 
 
    <form action="/action_page.php"> 
 
     First Name:<br> 
 
     <input type="text" name="firstname" value="First Name" title="Type your First Name" onfocus="this.value='';"> 
 
     <br><br> 
 
     Last Name:<br> 
 
     <input type="text" name="lastname" value="Last Name" title="Type your Last Name"> 
 
     <br><br> 
 
     Email:<br> 
 
     <input type="email" name="email" value="user@email.com" title="Type your email"> 
 
     <br><br> 
 
     Phone:<br> <!--Brazilian pattern (xx)x.xxxx-xxxx--> 
 
     <input type="tel" name="phone" pattern="^\(?:\(\d{2}\)|\d{2})[\d{1}][. ]?\d{4}[- ]?\d{4}"value="(xx)x.xxxx-xxxx" title="Type your phone number"> 
 
     <br><br> 
 
     Age:<br> 
 
     <input type="age" pattern=".{2,3}" name="idade" value="Age" title="Idade"> 
 
     <br><br> 
 
     <br><br> 
 
     <input type="submit" value="Submit"> 
 
    </form> 
 
</div>

Answer 1

、あなたのルールからtype="submit"を除外することができます。

input:not([type="submit"]) { 
 
    color: red; 
 
}

<input type="text" name="firstname" value="First Name" title="Type your First Name" onfocus="this.value='';"> 
 
<input type="text" name="lastname" value="Last Name" title="Type your Last Name"> 
 
<input type="email" name="email" value="user@email.com" title="Type your email"> 
 
<input type="tel" name="phone" pattern="^\(?:\(\d{2}\)|\d{2})[\d{1}][. ]?\d{4}[- ]?\d{4}" value="(xx)x.xxxx-xxxx" title="Type your phone number"> 
 
<input type="age" pattern=".{2,3}" name="idade" value="Age" title="Idade"> 
 
<input type="submit" value="Submit">