用什么css选择，能选中class前面和后面元素

Question

代码如下：

<view class="test bg">
      <view>111</view>
      <view>222</view>
      <view class="h">333</view>
      <view>444</view>
      <view>555</view>
      <view>666</view>
    </view>

我想用css选择器，怎么来选择 .h 前面那个view 和后面那个view

Answer 1

你可以使用CSS中的兄弟选择器（adjacent sibling selector）来选择 .h 前面那个view 和后面那个view，如下所示：

.test .h + view /* 选择 .h 后面的 view */
{
  /* 样式 */
}

.test view + .h /* 选择 .h 前面的 view */
{
  /* 样式 */
}

第一个选择器 .test .h + view 会选择紧随 .h 元素后面的 view 元素，而第二个选择器 .test view + .h 则会选择在 .h 元素之前的 view 元素。这里，.test 是 .h 和它前后的 view 元素的共同父元素。