Remove CSS class for Particular element in HTML - html

Question

I have defined Css class
form input[type="text"], form input[type="email"], form input[type="password"], form select, form textarea {
background: url("../images/input-bg.gif") repeat-x scroll 0 0 #FFFFFF;
border: 1px solid #CCCCCC;
padding: 4px 5px;
}
now when i use Input in html css affects to all input on the form
because i have used [form] in the css.
but i do not want to affect css to some input texboxes..
how can i achive this ?

Answer 1

I'd do it the other way, just add other classes to inputs you don't want to be affected by that rule. Something like this.
Edited adding comment suggestion
/* General rule for inputs */
form input[type="text"], form input[type="email"], form input[type="password"], form select, form textarea {
background: url("../images/input-bg.gif") repeat-x scroll 0 0 #FFFFFF;
border: 1px solid #CCCCCC;
padding: 4px 5px;
}
/* Specific rule for inputs */
form input[type="text"].reset-inputs, form input[type="email"].reset-inputs, form input[type="password"].reset-inputs, form textarea.reset-inputs, form select.reset-inputs {
background: none;
border: none;
padding: 0;
}

Answer 2

you can add a class for the input boxes you dont want an effect and override the other one:
<input class="noeffect"/>
form input.noeffect {
background: none;
}

Answer 3

Add a class to the input felds you like to affect:
html: <input class="here" ... />
css: form input.here[type="text"]
Or create a div region with your input's in it:
<div class="here">
<input /><input /><input />
</div>
css: form .here input[type="text"]

Answer 4

There are several properties like :nth-child() :last-child, :first-child etc:
Like this:
form input[type="text"] + form input[type="text"] {
background:none;
}
or
form input[type="text"]:nth-child(2n){
background:none;
}
or
give a class to it
form input.diff{
background:none;
}