CSS3 :target伪类的理解与使用

CSS3 :target伪类用来改变页面中锚链接URL所指向的ID元素的样式，例如你要改变描链接指向#tab的元素字体颜色为蓝色，哪么你可以这样写成#tab:target {color:blue}

浏览器支持：

不支持IE8及以下的IE版本，IE9支持这个属性，其它非IE内核浏览器如：Firefox、Chrome、等这些浏览器都支持。

用法：

:target伪类与:hover、:link、:visited、:focus等伪类的用法一样

:target {color:blue}

实例：CSS3 :target伪类实现Tab切换效果

下面简单介绍下如何用csse :target来制作一个无JavaScript的tab切换效果

HTML代码：

 
 
标签一
 
标签二
 
标签三
 
 
tab1 content
 
tab2 content
 
tab3 content
 
 

CSS代码：

.tab_content {
	position: absolute;
}
#tab1:target, #tab2:target, #tab3:target {
	z-index: 1;
}

原理其实很简单，就是把tab元素设为绝对对定位absolute,再通过:target伪类改变它们的层级（z-index）。