时间戳

首页 > 解决方案 > CSS中输入的几个ID

html - CSS中输入的几个ID

问题描述

所以我想自定义几个输入。我试过这个，它工作正常：

<!DOCTYPE html>
<html>
<head>
<style>

input[id=a]:focus {
  width: 250px;
}
</style>
</head>
<body>
<h1>The width Property</h1>

Searcha: <input type="text" name="search" id="a">
Searchb: <input type="text" name="search" id="b">

</body>
</html>

但是，我想在输入中添加更多 id。这是可能的？

//try
    input[id=a b]:focus {
      width: 250px;
    }

标签： htmlcss

解决方案

您可以像这样在 css 中链接选择器：

#foo, #bar {
    color: red
}

但是，如果您有 >5 个 id，这可能会有点乏味，此时最好使用一个类：

HTML：

<input class="search-input" />
<input class="search-input" />

CSS：

.search-input {
    color: red
}

推荐阅读