如何在CSS中根据其子元素的属性设置父元素的样式?

6rvt4ljy  于 2023-05-30  发布在  其他
关注(0)|答案(3)|浏览(485)

例如,当输入被禁用时,父元素的背景应为黑色,否则为白色。

<div><input type="text" disabled="disabled" /></div>

div input[type="text", disabled="disabled"] {
    background: Black;
}

我想设计父元素而不是子元素的样式。

h22fl7wq

h22fl7wq1#

无法使用CSS。
但这可能与JavaScript有关。

bf1o4zei

bf1o4zei2#

在最新版本的CSS中目前没有父选择器。

r7xajy2e

r7xajy2e3#

你可以用css的选择器来选择这个元素的父元素;
例如;
我们有一个div,div有一个输入元素;

.hasan-ablak {
            padding: 5px;
            background-color: green;
        }

.hasan-ablak:has(input:disabled) {
  background-color: orange;
}
.hasan-ablak:has(input:disabled) {
            background-color: red;
        }
<div class="hasan-ablak">
            <input type="text">
</div>
    
<div class="hasan-ablak">
  <input type="text" disabled>
</div>

相关问题