CSS仅在显示子项时应用样式：none

Question

是否可以在不使用JQuery的情况下将CSS应用于没有可见子项的div？

示例：

<div class="myparent">
   <div class="invisible"> I'm invisible</div>
   <div class="invisible"> I'm invisible</div>
   dummy text
</div>

.invisible {
    display: none;
}

.myparent {
    background-color: green;
}

作为myparent类的样式，我想使用这样的东西。

.myparent :has(:not([style*="display:none"])) {
   background-color: blue;
   border: 1px solid red
 }

在这种情况下，结果应该是应该有蓝色背景和红色边框。