console
<div class="box">
<div class="tab">
<input type="radio" id="TabRadio1" class="radio" name="tab" checked="checked"
/>
<label class="label" for="TabRadio1">
选项卡1
</label>
<div class="tab_content">
<p>
我是选项卡1对应的美女
</p>
<img src="http://image.zhangxinxu.com/image/study/s/s128/mm1.jpg" />
</div>
</div>
<div class="tab">
<input type="radio" id="TabRadio2" class="radio" name="tab" />
<label class="label" for="TabRadio2">
选项卡2
</label>
<div class="tab_content">
<p>
我是选项卡2对应的美女
</p>
<img src="http://image.zhangxinxu.com/image/study/s/s128/mm2.jpg" />
</div>
</div>
</div>
.box {
position: relative;
}
.tab {
float: left;
}
.label {
display: block;
}
.radio,
.tab_content {
position: absolute;
left: -999em;
}
.radio:checked ~ .tab_content {
left: 0;
right: 0;
}
.radio:checked ~ .label {
background-color: red;
}