用单选框的:checked伪类和相邻选择器实现
代码如下：
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
input, .table-content{
display:none;
}
#tab1:checked ~ #content1,
#tab2:checked ~#content2{
display:block;
}
</style>
</head>
<body>
<input id="tab1" type="radio" name="tabs" checked>
<label for="tab1">TAB1</label>
<input id="tab2" type="radio" name="tabs" >
<label for="tab2">TAB2</label>
<div id="content1" class="table-content">CONTENT11</div>
<div id="content2" class="table-content">66666</div>
</body>
</html>点击TAB1或者TAB2就可以切换啦！
转载请注明原文地址: https://ju.6miu.com/read-679576.html
