Css content属性详解

http://www.xunzou.com/blog/post/615.html

Content作为css的一个属性，它可以和伪对象:before :after一起使用。

例如：

CSS

 
.xunzou:before {  
        content:"你好啊";  
        color:#F00;  
    }  

html

 
<div class="xunzou">欢迎光临我的blog</div>    

浏览器显示的应该是：

这里红色的文字，你好啊，由content生成

Content 的值还可以设置为元素的属性

例如：

CSS

 
.xunzou2:hover{position:relative;z-index:1} 
    .xunzou2:hover:after{ 
        content:attr(href); 
        padding:8px; 
        background:#DCDCDC; 
        -moz-border-radius:5px; 
        -webkit-border-radius:5px; 
        border-radius:5px; 
        position:absolute; 
        left:0; 
        top:150%; 
        z-index:2 
        white-space: nowrap; 
        -moz-box-shadow:2px 2px 5px #333; 
        -webkit-box-shadow:2px 2px 5px #333; 
        box-shadow:2px 2px 5px #333; 
    }     

html

 
<a class="xunzou2" title="点击进入我的blog" >欢迎光临我的blog</a> 

浏览器显示的应该是：

点此查看demo