gpt4 book ai didi

CSS 选择的标签高于类

转载 作者:太空宇宙 更新时间:2023-11-03 20:01:46 25 4
gpt4 key购买 nike

<html>
<head>
<style>
input[type='text'], select {
background: blue
}

.error {
background: red
}
</style>
</head>
<body>
<input type="text" class="error"/>
<select class="error">
<option>non-sense</option>
</select>
</body>
</html>

如果类 .error 的背景是红色,则它必须是红色。即使 input[type="text"] 有蓝色背景。在 IE 和 GC 中测试。

最佳答案

您看到的问题的原因是 input[type=text].error 更具体,因此它将覆盖它。使用更具体的选择器:

input.error

或者如果你真的想要安全:

input[type=text].error

关于的更多信息CSS specificity, and how it's calculated


另一种方法是保留当前选择器,但在规则中添加 !important 关键字:

.error { background: red !important; }

这会立即使其覆盖与该元素匹配的任何其他规则。请注意,这是一个非常强大的工具,将来可能会导致意想不到的结果。

关于CSS 选择的标签高于类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13121111/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com