css - 仅当子元素具有类 X 时才调整 div 的高度

Question

.embed {
   height: 100px
}

只有当 iframe 类是 my-iframe 时，如何调整 div 容器的高度

<div class="embed">
   <iframe class="my-iframe">
</div>

我不希望它在以下情况下调整高度:

<div class="embed">
   <iframe class="some-other-iframe">
</div>

是否可以在 SASS 或 CSS 中这样做？

Answer 1

当您增加 iframe 的高度时，只要尚未为 div 指定高度，父 div 也会增加。您可以这样做来增加 iframe 的高度

iframe[class*="my-iframe"]{
   height: 500px /*or whatever height you want*/
}

这将仅针对包含类“my-iframe”的 iframe。