Html input type="button" 的 CSS 属性选择器不适用于 IE7
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2185549/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Css attribute selector for input type="button" not working on IE7
提问by Amra
I am working on a big form and it contains a lot of buttons all over the form, therefore I am trying to get working input[type="button"] in my main css file so it would catch all buttons with out having to add a class to every single one, for some reason this is not working on IE7, after checking on the web it says that IE7 should be supporting this.
我正在处理一个大表单，它在整个表单中包含很多按钮，因此我试图在我的主 css 文件中获取工作 input[type="button"] 以便它可以捕获所有按钮而无需添加每个人都有一个类，出于某种原因，这在 IE7 上不起作用，在网上检查后，它说 IE7 应该支持这一点。
Also it has to be type="button" and not type="submit" as not all buttons will submit the form.
此外，它必须是 type="button" 而不是 type="submit"，因为并非所有按钮都会提交表单。
Could anybody give a hint what am I doing wrong?
有人可以提示我做错了什么吗？
input[type="button"] {
text-align:center;
}
I have also tried input[type=button]
我也试过 input[type=button]
回答by ipr101
I was struggling getting input[type=button]selectors working in IE7 or IE8. The problem turned out to be that the HTML Pages were missing a "!DOCTYPE" declaration. Once I added
我正在努力让input[type=button]选择器在 IE7 或 IE8 中工作。问题原来是 HTML 页面缺少“！DOCTYPE”声明。一旦我添加
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Then everything worked fine. You can obviously use a different "!DOCTYPE" declaration to suit your requirements.
然后一切正常。您显然可以使用不同的“!DOCTYPE”声明来满足您的要求。
回答by bobince
input[type="button"]{ text-align:center; }
What do you expect that to do? The text in an <input type="button">is already centered by default.
你希望它做什么？<input type="button">默认情况下， an 中的文本已经居中。
If you want to align the button itself within the parent, you have to set text-alignon the parent element, not the button.
如果要text-align在父元素中对齐按钮本身，则必须在父元素上设置，而不是在按钮上。
Attribute selectors?—?with or without quotes?—?do work on IE7. It's IE6 that's the problem browser there.
属性选择器？—？带或不带引号？—？在 IE7 上工作。IE6 是那里的问题浏览器。
回答by Jeff Siver
I've had no problems getting css statements like that working in IE7; IE6 is always the problem but I believe this CSS would work in there as well. So I don't think IE7 is the problem.
我在 IE7 中获得类似的 css 语句没有问题；IE6 一直是问题，但我相信这个 CSS 也可以在那里工作。所以我不认为 IE7 是问题所在。
The first thing is that your CSS sample will only affect buttons, it will not affect submit buttons. But that's an easy fix; change your css to:
首先，您的 CSS 示例只会影响按钮，不会影响提交按钮。但这很容易解决；将您的 css 更改为：
input[type="submit"], input[Type="button"]
{ text-align: center; }
Second, as Manolo Santos said, could you have another CSS statement that is overriding the text-align setting? A setting on just input elements? It's probably worth using a developer tool like Firebug or the developer components built into Chrome or IE8 to help find the CSS problem.
其次，正如 Manolo Santos 所说，您能否有另一个覆盖 text-align 设置的 CSS 语句？仅输入元素的设置？使用 Firebug 等开发人员工具或 Chrome 或 IE8 中内置的开发人员组件来帮助查找 CSS 问题可能是值得的。
回答by Robbert van den Bogerd
Attribute selectors are, unfortunately, not yet well implemented in all major browsers, because it is CSS3 and not 2.1, the current standard. Because the guys over at W3C are not that quick in making decisions, you better not set your hopes too high, because we won't be able to use css3 any time soon. Some aspects of it are already implemented, but this one isn't (surely not in IE6).
不幸的是，属性选择器还没有在所有主要浏览器中得到很好的实现，因为它是 CSS3 而不是 2.1，当前的标准。因为 W3C 的人做决定不是那么快，所以你最好不要抱太大希望，因为我们很快就无法使用 css3。它的某些方面已经实现，但这个还没有实现（肯定不在 IE6 中）。
So, as you already said yourself, it would be much better to provide all of your inputs with a class, and make it a habit to do so every time you create a form. It's always handy and not a lot of work when you are already programming the form.
因此，正如您自己所说的那样，最好为所有输入提供一个类，并养成每次创建表单时都这样做的习惯。当您已经在对表单进行编程时，它总是很方便并且不需要做很多工作。
When I create a form, I always add the type of an input as a class, e.g.:
创建表单时，我总是将输入的类型添加为类，例如：
Especially the last two will come in handy in a lot of cases, because you don't háve to style the .button and .submit separately, but you cóuld if you would like to do so.
尤其是最后两个在很多情况下会派上用场，因为您不必分别设置 .button 和 .submit 的样式，但是如果您愿意，可以这样做。
回答by Manolo Santos
They work for me in IE7 (both forms, with and without quotes).
它们在 IE7 中为我工作（两种形式，带引号和不带引号）。
Maybe there's another selector that is masking yours. You could try making your selector more specific in order to give it more priority, e.g.:
也许还有另一个选择器掩盖了你的选择器。您可以尝试使您的选择器更具体，以便给予它更多的优先级，例如：
body form input[type="button"] {
background: red;
}
回答by Mehrad
I am pretty sure everybody is aware of the fact that the solution of adding a !DockType to the header isn't a possibility all the time.
我很确定每个人都知道将 !DockType 添加到标头的解决方案并不是一直都有可能。
For instance, I develop in DotNetNuke (DNN) environment which the developer doesn't have an access to the header. Then it makes it almost impossible to add !DocType.
例如，我在 DotNetNuke (DNN) 环境中开发，开发人员无权访问标头。然后几乎不可能添加！DocType。
In this case you don't have too much of an option except relating a CssClass to the button and referring to it, explicitly, in the CSS module.
在这种情况下，除了将 CssClass 与按钮相关联并在 CSS 模块中明确引用它之外，您没有太多选择。
回答by Pedro Gil
This question is old but if someone have a related problem.. I spend a few minutes trying to solve a similiar problem
这个问题很老，但如果有人有相关问题..我花了几分钟试图解决一个类似的问题
input[type="Submit"] doesn't work on IE7 (despite of IE assigning the style correctly to the input as I saw in dev tools).
input[type="Submit"] 在 IE7 上不起作用（尽管 IE 将样式正确分配给输入，正如我在开发工具中看到的那样）。
SOLUTION: I switched from Submitto submitand it worked!
解决办法：我从切换提交到提交和它的工作！
I posted this here because it may help someone when debugging.
我把这个贴在这里是因为它可以在调试时帮助别人。
回答by Micah Henning
For whatever reason, there are times when attribute selectors will not apply before the page is displayed in IE7. This actually just happened to me. My selector was table[bgColor="#c0c0c0"]and would not apply on page load. Since I was using IE9 (Browser Mode: IE7, Document Mode: IE7 Standards), I was able to use F12 Developer Tools to look at my CSS file. I unchecked the selector and then checked it again. The attributes applied after that. This is reproducible exactly in good ol' IE7, so I'm going to have to find a work-around. (Note: Neither using single, double, or no quotes nor making variations in capitalization make an impact here.)
无论出于何种原因，有时在 IE7 中显示页面之前，属性选择器将不适用。这实际上只是发生在我身上。我的选择器table[bgColor="#c0c0c0"]适用于页面加载。由于我使用的是 IE9（浏览器模式：IE7，文档模式：IE7 标准），因此我可以使用 F12 开发人员工具查看我的 CSS 文件。我取消选中选择器，然后再次选中它。之后应用的属性。这完全可以在好的 ol' IE7 中重现，所以我将不得不找到一个解决方法。（注意：无论是使用单引号、双引号还是不使用引号，也无论大小写的变化都不会在这里产生影响。）
