时间戳

首页 > 解决方案 > 如何使共享类名的两个 CSS 元素不同？

css - 如何使共享类名的两个 CSS 元素不同？

问题描述

两个元素具有相同的类名，在我的例子中是“img”

是否可以对作为两个不同类的子元素的元素进行不同的样式设置，即使它们具有相同的类名？

我希望“slide-type-final”类下的 img 元素的样式与“question-2”下的 img 元素不同

.slide-type-final>img {
    max-height: 40em;
}

.question2>img {
    max-height: 40em;
    display: inline-table;
}

标签： csscss-selectorsconditional-statements

解决方案

img在这种情况下不是类名，是吗？除了您在问题中已有的解决方案（？）之外，...：

1.) 您可以向父母申请第二个班级，例如，您将称呼<div class="slide-type-final up"><img scr="...">其孩子为imgslide-type-final.up>img { ... }

2.) 您可以对img标签应用不同的类，例如<div class="slide-type-final"><img class="up" scr="...">，您可以将其作为slide-type-final>img.up { ... }

推荐阅读