在一个页面中设置2组选项卡，默认选项卡为"checked“

<input type="radio" id="tab1" name="tabs" checked>
<label for="tab1">选项卡1</label>

<input type="radio" id="tab2" name="tabs">
<label for="tab2">选项卡2</label>

input[type="radio"] {
  display: none;
}

label {
  display: inline-block;
  padding: 10px 20px;
  background-color: #ccc;
  cursor: pointer;
}

input[type="radio"]:checked + label {
  background-color: #f00;
  color: #fff;
}

<div id="content1">
  <!-- 选项卡1的内容 -->
</div>

<div id="content2">
  <!-- 选项卡2的内容 -->
</div>

#content1, #content2 {
  display: none;
}

input[type="radio"]:checked + label + #content1 {
  display: block;
}

input[type="radio"]:checked + label + #content2 {
  display: block;
}