<!DOCTYPE html> <html> <head> <meta charset="gb2312" /> <title>CSS 虚线 eeeweb.cn实例说明www.eeeweb.cn</title> <style> .eeeweb-cn{ border:1px dashed #000; height:50px; width:350px} .eeeweb-cn-1{border-left:1px dashed #000; height:50px;width:350px} .eeeweb-cn-2{border-right:1px dashed #000; height:50px;width:350px} .eeeweb-cn-3{border-top:1px dashed #000; height:50px;width:350px} .eeeweb-cn-4{border-bottom:1px dashed #000; height:50px;width:350px} .eeeweb-cn-5{border:1px dashed #000; border-right:0;height:50px;width:350px} </style> </head> <body> 虚线实例实例<br> <div class="eeeweb-cn">我四边为虚线边框</div><br> <div class="eeeweb-cn-1">我的左边为黑色虚线边框</div><br> <div class="eeeweb-cn-2">我的右边为黑色虚线边框</div><br> <div class="eeeweb-cn-3">我的上边为黑色虚线边框</div><br> <div class="eeeweb-cn-4">我的下边为黑色虚线边框</div><br> <div class="eeeweb-cn-5">我的右边边框无边线而其它三边为黑色虚线边框实例</div> </body> </html>
//div边框虚线
<DIV style="BORDER-RIGHT: #6f3198 3px dashed; BORDER-TOP: #6f3198 3px dashed; BORDER-LEFT: #6f3198 3px dashed; BORDER-BOTTOM: #6f3198 3px dashed">此处输入文字</DIV>
<DIV style="BORDER-RIGHT: #4d6df3 3px dashed; BORDER-TOP: #4d6df3 3px dashed; BORDER-LEFT: #4d6df3 3px dashed; BORDER-BOTTOM: #4d6df3 3px dashed">此处输入文字</DIV>
<DIV style="BORDER-RIGHT: #a8e61d 2px dashed; BORDER-TOP: #a8e61d 2px dashed; BORDER-LEFT: #a8e61d 2px dashed; BORDER-BOTTOM: #a8e61d 2px dashed">此处输入文字</DIV>
<DIV style="BORDER-RIGHT: #ed1c24 2px dashed; BORDER-TOP: #ed1c24 2px dashed; BORDER-LEFT: #ed1c24 2px dashed; BORDER-BOTTOM: #ed1c24 2px dashed">此处输入文字</DIV>
<DIV style="BORDER-RIGHT: #787878 2px dashed; BORDER-TOP: #787878 2px dashed; BORDER-LEFT: #787878 2px dashed; BORDER-BOTTOM: #787878 2px dashed">此处输入文字</DIV>
<DIV style="BORDER-RIGHT: #ffa3b1 2px dashed; BORDER-TOP: #ffa3b1 2px dashed; BORDER-LEFT: #ffa3b1 2px dashed; BORDER-BOTTOM: #ffa3b1 2px dashed">此处输入文字</DIV>
春风如贵客,一到便繁华