使用CSS3实现选项卡切换的方法

    width:40px;   
    text-align:center;   
    line-height:20px;   
    background:rgba(70,121,189,0.75);   
}   
.tab-control a:hover{   
    background:rgba(70,121,189,1);   
}   
.tabs{   
    position:relative;   
    border:1px solid red;   
    height:200px;   
    width:135px;   
    overflow:hidden;   
}   
.tab{   
    height:100%;   
    width:100%;   
}   
:target{   
    display:block;   
}  

看看效果：Demo
当然，:target的功能不仅局限于此。隐藏元素、创建lightbox 等。MDN上给了很多个demo:more demo.
你自己也可以脑洞大开一下，哈哈。
浏览器支持

对于:target伪类，浏览器支持情况还是不错的。