时间戳

首页 > 解决方案 > 如何将两个不同的父元素添加到sass中的一个公共子元素？

html - 如何将两个不同的父元素添加到sass中的一个公共子元素？

问题描述

有没有办法将两个不同的父元素添加到单个公共子元素？

next 和 prev 在它们的 HTML 结构中都包含一个 span 元素。

.carousel-control-next,.carousel-control-prev{
       width:unset;
        span{
            background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(252,122,34)' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E")!important;
        }


    }

这仅适用于下一个元素“.carousel-control-next”，但不适用于上一个“.carousel-control-prev”？如何使其同时适用于两者？

标签： htmlcsssass

解决方案

也许你正在寻找这样的东西：

.parent1, .parent2 {
  & .child {
    color: red;
  }
}

渲染的 CSS 是：

.parent1 .child, .parent2 .child {
  color: red;
}

我认为无论父母如何，直接向孩子添加一个类是一个更好的选择：

.redChild {
   color: red;
}

推荐阅读