189 8069 5689
表格边框默认是以实线进行显示的，怎么才能把它变成虚线呢？其实很简单只要简单加一些样式属性便可搞定，希望下面的例子对大家有所帮助
创新互联建站是一家专业提供六合企业网站建设,专注与成都网站设计、成都网站制作、H5响应式网站、小程序制作等业务。10年已为六合众多企业、政府机构等服务。创新互联专业网站制作公司优惠进行中。
复制代码
代码如下:
style
.table5{text-align:center;
border:1px
solid
#cccccc;
border-radius
:3px;
background-color:#FFFFFF;
width:650px;}
.table5
td{border-bottom:1px
dashed
#cccccc;}
.table5
.last
td{border-bottom:0;}
/style
复制代码
代码如下:
table
width="100%"
border="0"
cellpadding="2"
cellspacing="0"
class="table5"
tr
td
colspan="4" /td
/tr
tr
td
width="4%"img
src="images/greendot.jpg"
width="4"
height="4"
//td
td
width="17%"
class="text-fl"萍水相逢/td
td
width="63%"
align="center"
class="text-fl"消费10个金币，对换10元手机费/td
td
width="16%"
align="center"
valign="middle"2013.01.20/td
/tr
tr
class="last"
td
img
src="images/greendot.jpg"
//td
td
class="text-fl"M萍水相MM/td
td
align="center"
class="text-fl"消费500积分，对换500粉丝/td
td
align="center"
valign="middle"2013.01.20/td
/tr
tr
td
colspan="4"/td
/tr
/table
已知的方式有2种（纯样式）：
1.用标签（div、span这些标签都可以）的边框线设置虚线来实现，比如在需要的位置插入div然后设置border-top(或者border-bottom):1px dashed #e5e5e5;(3个属性分别表示：1像素的边宽 虚线 颜色)；
2.用hr,不过因为实现方式和方式一一样，比如：hr style="height:1px;border:none;border-top:1px dashed #e5e5e5;" /，但是这个标签在H5种已经被淘汰了，完全可以靠第一种来实现。第二种就当做是知识扩展
css有两种虚线形式，一种是dashed，一种是dotted；如：
div style="width:100px;height:100px;border:1px dashed red"/div
div style="width:100px;height:100px;border:1px dotted red"/div
效果图如下：
在CSS 中常见的边框(border) 属性有以下几种：
border-style
border-width
border-color
border-top-, border-left-, border-bottom-, border-right-
border
border-style
border-style属性指定边框的样式。以下的表格列出这个属性可能有的值，以及每一个值显现出来的结果。
border-width
border-width属性是用来设定边框的宽度。可用的值为thin (薄)、medium (中等)、thick (厚)，或是一个数字。
border-color
border-color属性是用来设定边宽的颜色。
border-top-, border-left-, border-bottom-, border-right-
我们可以将方向(top -上、bottom -下、left -左、right -右)和样式、宽度、及颜色合起来而成为一个属性。举例来说， border-top-style属性就是用来设定上边框的样式。以下举几个例子：
border
若四边的边框属性都一样，那我们可以用一个border属性来描述，而不必四个边都描述一次。另外，我们可以在同一行一次宣告边框样式、边框宽度、以及边框颜色。
p {
border:#0000FF 5px solid;
}
那以下的HTML，
p用一行来宣布所有边框的属性/p
会显现出
在css里可以设置边框,你可以只要上边框或者下边框,你可以设置只要上下不要左右,这样就不会有重叠了!
style type="text/css"
!--
.dashed_tbl {
border-top: 1px dashed #333333;
border-left: 1px dashed #333333;
}
.dashed_tbl td{
border-bottom:1px dashed #333333;
border-right:1px dashed #333333;
padding:3px 10px;
}
--
/style
table cellpadding="0" cellspacing="0" class="dashed_tbl"
tr
td123/td
td234/td
td345/td
/tr
tr
td123/td
td234/td
td345/td
/tr
tr
td123/td
td234/td
td345/td
/tr
/table
是不是这样的?