定义输入类型的 CSS 异常

发布于 2024-11-30 15:29:14 字数 611 浏览 0 评论 0原文

我已经在 css 文件上创建了输入类型样式,通过该文件,我更改了输入类型文本框的样式,并且我在整个网页中使用了该样式。但是,现在我遇到了一个问题,我希望特定的输入类型不应受到我创建的 css 文件的影响。简而言之,我想要针对特定​​输入类型的 css 异常。这样...输入样式保持不变,并且不受 css 样式的影响。任何想法,如何实现这一点。 想法将不胜感激!

这是我的 css 文件的代码

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;

}

,我想要它,它不应该应用于此

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

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" />

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

稀香 2024-12-07 15:29:14

以下选择器将帮助您在 CSS3 中排除 image 类型:

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

如果您不想依赖 CSS3 - 您可能不会,因为浏览器兼容性 - 您应该将初始选择器更改为更具体,如下所示:

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

编辑:似乎需要更深入的解释

这将起作用的原因是因为它不会专门排除任何输入类型,但您会只包含您想要的类型 目标。

因此,我不想说我有 a、b 和 c,而是想排除 b。你可以说我只想瞄准 a 和 c。

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.

蝶…霜飞 2024-12-07 15:29:14

如果您不关心 IE 8 及更低版本,您可以使用 :not()< /代码>。否则,您将需要覆盖为图像输入应用的所有样式,或者找到其他方法来使选择器更加具体(例如向每个输入添加一个类)。

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).

分分钟 2024-12-07 15:29:14

这可能太明显了,无法建议,但是您可以在您不希望应用样式的文本区域上放置一个 id 吗?然后赋予这个元素自己的风格?

否则,您可以尝试使用一组更具体的后代选择器来定位该特定元素。

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.

双马尾 2024-12-07 15:29:14

您可以为您不希望样式化的输入提供 class="nostyle",然后在 CSS 中定义......

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

或任何您想要的非样式化输入。

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.

甜柠檬 2024-12-07 15:29:14

有多种方法可以满足您的要求,但我建议不要这样做。我建议让所有样式元素(包括输入等)在 CSS 中具有实际的类,而不仅仅是输入。这样您可以轻松地使项目没有类或具有不同的类。

我明白这并不能回答你的问题,但希望这会对你有所帮助,如果你确实改变它,尽管编写更多 CSS 很麻烦,但从长远来看更好,可能是这样的:

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


input.alternate {
   something:here;
}

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;
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文