css相邻兄弟选择器

css选择相邻元素：

<div class="container">
      <h1>HTML5常见问答?</h1>
      <div class="tab">
        <input type="radio" name="acc" id="acc1" />
        <label for="acc1">
          <h2>01</h2>
          <h3>HTML5中有哪些不允许写结束标记的元素?</h3>
        </label>
        <div class="content">
          <p>
            主要有area、base、br、col、command、embed、hr、img、input、keggen、link、meta、param、souce、track、wbr。
          </p>
        </div>
      </div>
</div>

上面结构中有一个单选按钮 ，现在我要选择单选按钮被选中后的类名为content的div

// ~选择所有的，不管位置
  .container .tab input:checked~.content{
        max-height: 100vh;
      }

// +选择第单选按钮选中后的第一个兄弟元素，此时会选不到，选中的会是label
  .container .tab input:checked~.content{
        max-height: 100vh;
      }