<style>
.divcss5{ border:1px dashed #000; height:50px; width:350px}
.divcss5-1{border-left:1px dashed #000; height:50px;width:350px}
.divcss5-2{border-right:1px dashed #000; height:50px;width:350px}
.divcss5-3{border-top:1px dashed #000; height:50px;width:350px}
.divcss5-4{border-bottom:1px dashed #000; height:50px;width:350px}
.divcss5-5{border:1px dashed #000; border-right:0;height:50px;width:350px}
/* www.divcss5.com实例 */
</style>
</head>
<body>
www.divcss5.com css虚线实例实例
<div class=”divcss5″>我四边为虚线边框</div>
<div class=”divcss5-1″>我的左边为黑色虚线边框</div>
<div class=”divcss5-2″>我的右边为黑色虚线边框</div>
<div class=”divcss5-3″>我的上边为黑色虚线边框</div>
<div class=”divcss5-4″>我的下边为黑色虚线边框</div>
<div class=”divcss5-5″>我的右边边框无边线而其它三边为黑色虚线边框实例</div>
</body>
</html>
2、超链接虚线下划线 – TOP
我们常常会设置被链接的文字内容要么带链接有虚线的下划线，或鼠标移动到有链接的文字上出现虚线下划线，这个怎么实现的呢，这里为大家介绍关于CSS超链接的虚线下划线。
一、带链接文字有虚线下划线
这里也是通过CSS border边框属性来控制超链接a对象的CSS样式。
演示CSS代码：
复制代码a{ border-bottom:1px dashed #111;}/* 这里设置带链接文字下方出现虚线下划线*/
复制代码a:hover{ border:0;}/* 这里设置鼠标经过被链接文字时不出现虚线 */
完整DIV CSS代码：
复制代码<!DOCTYPE html>
<html>
<head>
<meta charset=”gb2312″ />
<title>CSS 虚线下划线 DIVCSS5实例说明</title>
<style>
a{ border-bottom:1px dashed #111;text-decoration:none;}
a:hover{ border:0;}
</style>
</head>
<body>
欢迎到<a href=”http://www.divcss5.com/”>CSS教程网</a>的www.divcss5.com – divcss5学习CSS
</body>
</html>
说明：text-decoration:none;这个是去掉CSS 下划线（超链接默认自带的下划线属性）
以上为有CSS超链接的文字带虚线下划线。
二、鼠标放到带链接文字上时出现虚线下划线
这个和上面的很相似，只需对超链接 A去掉下划线，对鼠标经过时CSS文字下方带虚线边框下划线即可。
对应CSS代码：
复制代码a{text-decoration:none;}
[/code]a:hover{border-bottom:1px dashed #111;} [/code]这样就实现，大家不妨试试超链接下划线实例。
