css中把表格的边框显示出来

CSS表格边框显示方法
在网页的前端开发中，表格是一个非常常用的元素。但是，在表格中，如何显示边框却常常让人头疼。下面就来介绍一下如何在CSS中把表格的边框显示出来。
对于一个普通的表格，默认情况下是没有边框的。在CSS中，我们可以利用border属性来给表格加上边框。代码如下：

table{
    border-collapse: collapse; /*合并边框*/
    border: 1px solid #cccccc; /*设置边框大小和颜色*/
} 

上述代码中，我们给table标签添加了一个叫做border-collapse的属性，它的作用是合并边框。这个属性的默认值是separate，即使用分离的边框。如果想让表格的边框连成一体，就需要将其设置为collapse。
接下来，我们给table标签的border属性设置了1px的边框大小和#cccccc颜色。这样，我们就可以看到表格的边框被显示出来了。
但是，仅仅加上边框，并不能使表格看起来更加美观。我们可以继续使用CSS来美化表格。
我们可以给表格单元格（即和）添加padding和text-align属性来调整表格内容的居中和间距。

td, th {
    padding: 5px; /*设置单元格的内边距*/
    text-align: center; /*居中*/
} 

最终的表格代码应该是这样的：

table{
    border-collapse: collapse;
    border: 1px solid #cccccc;
}
td, th {
    padding: 5px;
    text-align: center;
} 

现在，你已经掌握了在CSS中把表格的边框显示出来的方法。通过进一步的美化，你可以制作出更加漂亮的表格。