css - 根据具有LESS的其他类的元素样式

Question

我有这部分 less 和 html 标记：

<div class="block">
   <div class="post-image"></div>
   <p></p>
</div>

和

  .post-image {
    display: inline-block;
    width: 35%; height: 80px;

    &.photo {
      width: 100%; height: 180px;
    }
  }

  p {
    width: 64%;
    display: inline-block;

    when (isstring .post-image.photo) {
      width: 100%;
  }

我知道这是错误的设置，但我只是想知道，有没有可能p通过照片宽度或类别来附加此段落（）样式？非常感谢您的帮助。

Answer 1

从技术上讲，这甚至不是 LESS 的事情，而纯粹是针对您的情况的 CSS 构造（当然，LESS 可以帮助您构建）。这是您需要的 LESS 和 HTML 片段的结果 CSS（.post-image代码与您已有的一样）：

较少的

p {
  width: 64%;
  display: inline-block;

  .post-image.photo + & {
    width: 100%;
  }
}

CSS

p {
  width: 64%;
  display: inline-block;
}
.post-image.photo + p {
  width: 100%;
}

当.photo类添加到.post-image.