css 版的tab切换
tab切换* {
margin: 0;
padding: 0;
}
.content{
width: 500px;
height: 500px;
margin:30px auto 0;
}
.box {
width: 20em;
height: 10em;
border: 1px solid #ddd;
overflow: hidden;
}
.list {
height: 100%;
background: #ddd;
text-align: center;
position: relative;
font-size: 8em;
}
.list>input {
position: absolute;
top: 0;
height: 100%;
width: 1px;
border: 0;
padding: 0;
margin: 0;
clip: rect(0 0 0 0);
}
.one {
background-color: pink;
}
.two {
background-color: hotpink;
}
.three {
background-color: #8484c3;
}
.four {
background-color: yellow;
}
.link{
margin-top: 30px;
}
.click{
padding: 5px 10px;
border: 1px solid red;
}
12341
2
3
4
结果
结果 1
结果2