defining CSS exception for input type

I have created on css file for input type styling, by which, i am changing the style of input type textbox, and that i have used in my whole web page. But, now i got one problem, i want that, a particular input type, shouldn't be affected by my created css file. In short, i want css exception, for particular input type. 开发者_运维知识库So that... input styling remain same and not be effected by css styling.Any idea, how to achieve this. Idea will be appreciated !!!

this is the code of my css file

input
{
color:#000000;
font-size:14px;
border:#666666 solid 2px;
height:24px;
margin-bottom:10px;
width:200px;


}
textarea
{
color:#000000;
font-size:14px;
border:#666666 solid 2px;
height:124px;
margin-bottom:10px;
    width:200px;

}

and i want that, it should not be applied on this

<input type="image" src="images/loginbutton.png" style="width:80px;height:40px" />

The following selector will help you in CSS3 to exclude the image type:

input:not([type="image"])

If you don't want to rely on CSS3 - you probably don't, because of browser compatibility - you should change your initial selectors to be more specific like so:

input[type="text"], input[type="password"]

Edit: More in-depth explanation seems needed

The reason this will work, is because it won't specifically exclude any input types, but you will be only including the types that you do want to target.

So instead of saying I have a, b and c and I want to exclude b. You can say I want to only target a and c.

If you don't care about IE 8 and lower, you can use :not(). Otherwise you will need to either override all the styles you are applying for the image input or find some other way to make the selector more specific (such as adding a class to each input).

This might be too obvious to suggest, but could you put an id on the textarea that you don't want the style applied to? Then give this element it's own style?

Otherwise, you could try using a more specific set of descendant selectors to target that particular element.

You could give the input you DON'T want styled a class="nostyle", then define, in CSS ...

.nostyle {
    margin: 0;
    border: 0;
    }

... or whatever you'd like non-styled inputs to be.

There are ways to do what you ask, but I would recommend not doing this. I would recommend making all of your styled elements (Including inputs, etc have actual classes in the CSS rather than just for the input. This way you can easily make items not have a class or have a different class.

I understand this does not answer your question but hopefully this will help you and if you do change it, as much as it's hassle to write more CSS, it's better in the long run, possibly something like this:

input.normal {
    color:#000000;
    font-size:14px;
    border:#666666 solid 2px;
    height:24px;
    margin-bottom:10px;
    width:200px;
}


input.alternate {
   something:here;
}