用CSS border边框属性的用法，实现不同样式的下划线，除了使用border-bottom外，还可以使用css border为对象的下边框设置实线（solid）或虚线（dashed）效果，类似于实现了文字下划线的实线、虚线效果。
接下来我们CSS+DIV实例实践使用border-bottom实现文字下划线颜色和虚线实线改变：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>下划线样式-虚线、实线</title>
<style>
.-aa{ border-bottom:1px dashed #F00; color:#0FF}
/*设置对象.-aa下边框为虚线红色，css字体颜色为天蓝色*/
.-bb{ border-bottom:1px solid #00F; color:#090}
/*设置对象.-bb下边框为实线蓝色，对象DIV字体颜色为绿色*/
#n{margin:10px auto; width:920px; border:1px solid #CCC;font-size:12px; line-height:30px;}
#n a{ padding:0 4px; color:#333}
</style>
</head>
<body>
<p><span class="-aa">下划线为虚线红色，字体为蓝色</span></p>
<p><span class="-bb">下划线为实线蓝色，字体为绿色</span></p>
</body>
</html>定义下划线后，最终的运行效果：
