content 属性与 :before 及 :after 伪元素配合使用，来插入生成内容。该属性用于定义元素之前或之后放置的生成内容。默认地，这往往是行内内容，不过该内容创建的框类型可以用属性 display 控制。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>添加content内容</title>
<style type="text/css">
#nav {
margin:20px auto;
width:200px;
border:1px solid #f90;
padding:20px;
line-height:22px;
font-size:18px;
}
#nav a {
display:block;
font-size:12px;
line-height:22px;
color:#00F;
}
a[href$=html]:before {
content:"网页：";
}
a[href$=jpg]:before {
content:"图片：";
}
a[href$=doc]:before {
content:"Word文档：";
}
a[href$=pdf]:before {
content:url("images/pdf.gif");
}
</style>
</head>
<body>
<div id="nav"><a href="images/Code4-5.html">登录页面</a> <a href="images/IL5.jpg">杭州风光</a> <a href="images/test.doc">参考资料</a> <a href="images/Pattern.pdf">设计模式培训</a> </div>
</body>
</html>
Processed:
0.017, SQL:
9
