CSS 样式父元素答案

【问题标题】：CSS Style Parent ElementCSS 样式父元素
【发布时间】：2016-05-12 20:19:47
【问题描述】：

我有一段 PHP 代码迭代数据库查找，每次迭代都会向父 select 元素添加一个选项。

我可以将表中的列值添加到每个选项的类名称中，然后我可以使用 option[class*="columnvalue"] 来引用它

我想设置选项所属的select元素的背景色。

总之，我想：父级::option[class*="xyz"]

我看到了一些关于

    echo '<select class="dropdown" name="'.$time.'-'.$group.'-'.$iteration.'-'.$new_date.'" >';
$code="";

while ($row = $result->fetch_assoc()) {

              unset($firstname, $lastname);
              $firstname = $row['firstname'];
              $lastname = $row['lastname']; 
              $memberid = $row['memberid'];
              $code = $row['code'];
              echo '<option class="drop" value="'.$memberid.'">'.$firstname . ' ' . $lastname .'</option><option value="cancel-'.$memberid.'">Cancel</option>';
}

以下将适用于该选项，但红色背景仅在下拉菜单展开时显示，而不是在选中时显示

 option[class*="drop"]{background-color:red;}

也试过这个（我不相信它实际上是一个有效的运营商选择

【问题讨论】：

CSS 中没有父选择器，因此您需要使用 JavaScript。如果您显示一个代码示例也很有帮助，这样我们就可以准确地看到您在追求什么以及您尝试了什么。
在我的原始帖子中添加了代码
Is there a CSS parent selector?的可能重复
那是六年前的帖子，但情况可能已经改变
不，CSS 中仍然没有父选择器

标签： css

【解决方案1】：

建议的语法是

select:has(option[class*="drop"]) { background-color:red; }

选择所有包含option[class*="drop"] 元素的select 标签。

但它isn't supported by any browser yet。

【讨论】：