为 'active' 和 'non-active' 图 class 添加不同的不透明度

Adding different opacities to 'active' and 'non-active' figure class

我正在尝试在旋转木马滑块上的图像上创建不同的不透明度。

有两个 DIV 类 一个在焦点上，其余的 focus/not 不活跃。

  1. figure class="flkty-carousel__cell gallery-item object-fit-img object-fit-img--loaded"

  2. figure class="flkty-carousel__cell gallery-item object-fit-img object-fit-img--loaded is-selected"

我希望加载的 DIV 不透明度为 0.5，'is-selected' DIV 不透明度为 1。

我可以轻松地将其添加到 CSS:

.flkty-carousel__cell {
    opacity: 0.5;
}

但现在所有图像的不透明度都为 0.5。

如何添加正确的 CSS 来分隔两个 DIV 类？

.flkty-carousel__cell.is-selected {
    opacity: 1;
}

此选择器将定位同时具有 .flkty-carousel__cell class 和 .is-selected class.

的元素