需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：div {height:60pxborder-bottom:1px dashed}。
3、浏览器运行index.html页面，此时通过css定义了一个水平的虚线。
同理啊。还是用border定义
如果页面中的所有表格都要定义的话，可以如下定义：
table {
border-top:1px solid #F00/*上部边框*/
border-bottom:1px solid #F00/*下部边框*/
border-left:1px solid #000/*左部边框*/
border-right:1px solid #000/*右部边框*/
}
如果只定义某个table，可以如下定义：
.colorfultable {
border-top:1px solid #F00/*上部边框*/
border-bottom:1px solid #F00/*下部边框*/
border-left:1px solid #000/*左部边框*/
border-right:1px solid #000/*右部边框*/
}
===============
如果页面中的所有表格内都要定义的话，可以如下定义：
table td {
border-top:1px solid #F00/*上部边框*/
border-bottom:1px solid #F00/*下部边框*/
border-left:1px solid #000/*左部边框*/
border-right:1px solid #000/*右部边框*/
}
如果只定义某个table，可以如下定义：
.colorfultable td {
border-top:1px solid #F00/*上部边框*/
border-bottom:1px solid #F00/*下部边框*/
border-left:1px solid #000/*左部边框*/
border-right:1px solid #000/*右部边框*/
}
<table border="0" cellspacing="0" cellpadding="0" class="colorfultable ">
这是因为如果设定border，那么别忘了实际上在垂直方向是有两个边框的（上边框和下边框），所以即使你把border设为1像素，但实际呈现的则是2像素的效果。解决办法就是只设置上边框或下边框：hr {border:noneborder-bottom:1px dashed graywidth:400px}
