CSS选择器-是否可以只使用[type =” text”]而不输入[type =” text”]？

Question

我一直想知道在CSS中使用[type="text"]而不是input[type="text"]是否安全。

原因是通过使用input[type="text"] ，我无法使用单个类选择器覆盖它。

// HTML
<input type="text" class="has-error">

// CSS
input[type="text"] { color: black; } // has stronger specificity than below
.has-error { color: red; }           // won't override

那么，HTML中是否还有其他使用type属性的元素？ 到目前为止，我还没有遇到其他使用它的标签。

谢谢

Answer 1

以下标记支持type属性：

<button>, <input>, <command>, <embed>, <object>, <script>, <source>, <style>, <menu> （ 源 ）

并且只有input标记具有“文本”作为type属性的可能值

因此，是的，假设标记正确编写，并且[ type="text"]应该很好，并且此类选择器中的规则将仅在类型为text的输入元素上设置。

Answer 2

是的，除非您没有其他具有type属性的元素，否则可以安全地使用它，但是如果您喜欢“ <ul> ”也可以具有type属性，则也可以选择它，但是因为您还使用“ text”作为类型对其进行了过滤因此，您不会与内置标签发生冲突，但会在插件等中发生冲突，并且您自定义标签，因此请制定解决方案以使用input [type =“ text”]

Answer 3

最好将它与标记名一起使用（按标记名选择和按属性过滤要比选择所有标记并对其进行过滤要快得多-您可以忽略它，但是请记住这一点）

覆盖这样做

input[type="text"] { color: black; }
input[type="text"].has-error { color: red; } 

您可以在此处检查http://jsbin.com/rayinebaro/1/edit?html,css，输出