input[type='text'] CSS 选择器不适用于默认类型的文本输入?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9603876/
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
input[type='text'] CSS selector does not apply to default-type text inputs?
提问by Yarin
The default input type is 'text'. I have always assumed then that CSS declarations targeting input[type='text']
would affect those inputs even if the type was not explicitly declared on the control. However, I just noticed that my default-type text inputs do not get the styles. Why is this the case? And how can I address this?
默认输入类型是“文本”。我一直假设 CSS 声明目标input[type='text']
会影响这些输入,即使类型没有在控件上显式声明。但是,我只是注意到我的默认类型文本输入没有样式。为什么会这样?我该如何解决这个问题?
input[type='text'] {
background: red;
}
<input name='t1' type='text' /> /* Is Red */
<input name='t1' /> /* Is Not Red */
回答by Mr Lister
The CSS uses only the data in the DOM tree, which has little to do with how the renderer decides what to do with elements with missing attributes.
CSS 只使用 DOM 树中的数据,这与渲染器如何决定如何处理缺少属性的元素几乎没有关系。
So either let the CSS reflect the HTML
所以要么让 CSS 反映 HTML
input:not([type]), input[type="text"]
{
background:red;
}
or make the HTML explicit.
或使 HTML 显式。
<input name='t1' type='text'/> /* Is Not Red */
If it didn't do that, you'd never be able to distinguish between
如果不这样做,您将永远无法区分
element { ...properties... }
and
和
element[attr] { ...properties... }
because all attributes would always be defined on all elements. (For example, table
always has a border
attribute, with 0
for a default.)
因为所有属性总是在所有元素上定义。(例如,table
始终有一个border
属性, with0
为默认值。)
回答by Jukka K. Korpela
By CSS specifications, browsers may or may not use information about default attributes; mostly the don't. The relevant clause in the CSS 2.1 spec is 5.8.2 Default attribute values in DTDs. In CSS 3 Selectors, it's clause 6.3.4, with the same name. It recommends: “Selectors should be designed so that they work whether or not the default values are included in the document tree.”
根据 CSS 规范,浏览器可能会或可能不会使用有关默认属性的信息;大多数情况下不会。CSS 2.1 规范中的相关条款是5.8.2 DTD 中的默认属性值。在 CSS 3 选择器中,它是同名的子句6.3.4。它建议:“应该设计选择器,以便无论文档树中是否包含默认值,它们都可以工作。”
It is generally best to explicitly specify essential attributes such as type=text
instead of defaulting them. The reason is that there is no simple reliable way to refer to the input
elements with defaulted type
attribute.
通常最好明确指定基本属性,例如type=text
而不是默认它们。原因是没有简单可靠的方法来引用input
具有默认type
属性的元素。
回答by Starx
Because, it is not supposed todo that.
因为,它不应该这样做。
input[type=text] { }
is an attribute selector, and will only select those element, with the matching attribute.
input[type=text] { }
是一个属性选择器,只会选择那些具有匹配属性的元素。
回答by aguante
To be compliant with all browsers you should always declare the input type.
为了与所有浏览器兼容,您应该始终声明输入类型。
Some browsers will assume default type as 'text', but this isn't a good practice.
一些浏览器会假定默认类型为“文本”,但这不是一个好习惯。
回答by azzeth_alhavizh
try this
尝试这个
input[type='text']
{
background:red !important;
}