html - 通用文本框的 CSS 选择器

Question

例如，有没有一种方法可以使用 CSS 选择器来选择每种类型的文本框，使它们具有相同的宽度？我所说的文本框只是指用户可以输入的内容。

我的问题是它们太多了。它曾经相当简单；你只有两种类型的 HTML4 文本框。这两种类型是 text 和 password，所以 CSS 可以是

input:not([type]), input[type='text'], input[type='password'] {...}

这将涵盖所有类型。然而，随着 HTML5 的发明，您获得了更多类型，例如 number、email、url、search 和 tel，它们看起来和行为都一样(除了您应该输入的内容之外)，我想通过 CSS 以相同的方式处理它们。

写这些真的有必要吗？

input:not([type]),
input[type='text'],
input[type='password'],
input[type='number'],
input[type='email'],
input[type='url'],
input[type='search'],
input[type='tel'] {...}

是否有更高效的代码编写方法？

Answer 1

是否存在更明智的解决方案？

上一堂不错的旧时尚课怎么样？

<input class='text' type='text'>

或覆盖非文本类型

input {
    background: red;
}

input[type=radio], input[type=checkbox], input[type=submit] {
    background: yellow;
}

---

另外:在我看来，您的解决方案没有任何问题。

您只需添加新的 html5输入类型:

• 颜色
• 日期
• 日期时间
• 本地日期时间
• 电子邮件
• 月
• 人数
• 范围
• 搜索
• 电话
• 时间
• 网址
• 周