I have a form, and I want to gray out the textboxes, but in doing that, the text of the "submit" type goes light gray too. So I decided to make the CSS for all inputs where the type is not equal to "submit", but I'm having problems doing that. I know that if I wanted to select all inputs that contain "submit", I should use input[type*="submit"]
and the syntax to not select a specific element is :not(attribute)
, but I cant figure out how to implement something like input[type:not("submit")
.
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="[email protected]" 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>
Using the :not()
selector with the attribute selector, you can exclude type="submit"
from your rule.
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="[email protected]" 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">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With