css - 按输入类型选择标签

Question

有没有办法通过输入类型排除或选择标签，类似于输入字段？

label:not([type=checkbox])
label[type=checkbox] 

Answer 1

如果您为您的复选框提供特定的 ID，并且所有这些 ID 都以相同的内容开头，您可以执行以下操作:

HTML

<input type="checkbox" id="chkTerms" />
<label for="chkTerms">Read terms & conditions</label>

CSS

label[for*="chk"], label[htmlfor*="chk"]
{
css here
}

不过可能仅限于现代浏览器。编辑:我刚刚试过一个 fiddle :link它适用于 chrome 和 IE 8 & 9，但不适用于 7。我没有在 FF 中尝试过。

EDIT2:只是为了解释这里发生了什么，方括号寻找一个被调用的属性。星号将 equals 的行为从简单的 equals 更改为包含 - 无论 for 属性包含“chk”的地方，它都会应用该样式。您可以将 * 替换为 ^，它会将其更改为表示开头而不是包含。

EDIT3:BoltClock 在评论中提供了针对 IE7 的修复，我更新了答案以包含它。