html - CSS - 选择下一个元素

标签 html css selector

我不知道如何解释这个很好但是... 我想选择一个元素,但它与其他元素“相距甚远”

像这样:

<div class="image-div">
    <img src="forest.png" class="image forest">
</div>
<p>
    I want to change the color of this text if the image there ^ is "forest", which I'll change with JS
</p>

.image.forest [some selector idk] p {
    color: red;
}
.image.train [some selector idk] p {
    color: blue;
}

最佳答案

如果它适合你,你可以像这样重写它。

<div class="image-div forest">
    <img src="forest.png" class="image">
</div>

<p>I want to change the color of this text if the image there ^ is "forest", which I'll change with JS</p>

<style>
  .forest + p {
    color: red;
  }
  .train + p {
    color: blue;
  }
</style>

关于html - CSS - 选择下一个元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40142681/

相关文章:

html - 文本重叠视频标签 CSS

javascript - Bootstrap 导航栏垂直到水平或反之亦然。事件触发

html - 导航栏内部选项卡定位

javascript - 隐藏的 div 出现和背景元素消失/不可见

javascript - 文本区域选择器的自动完成中间 javascript jquery

jquery - 如何获取类的属性?

Jquery 计数 2 个元素之间的项目

html - 在 go 中提供 .html 模板时,它不会加载任何媒体

css - flex 属性与按钮高度混淆?

jquery - 为什么我的 jQuery 选择器不起作用?