Question

细线边框单元格 CSS

如何简单的用CSS设置表格所有的单元格边框为1px

我知道的方法是分别设置border-top bottom left right,这样太麻烦了，有什么快速的方法吗

Answer 1

使用 CSS border 属性 控制边框线。

定义和用法

　　border 简写属性在一个声明设置所有的边框属性。

　　可以按顺序设置如下属性：

• 　　border-width

• 　　border-style

• 　　border-color

　　如果不设置其中的某个值，也不会出问题，比如 border:solid #ff0000; 也是允许的。

border-style 属性用于设置元素所有边框的样式，或者单独地为各边设置边框样式。可能值有：

注意：

　　如果是设置表格单元格的表框线，还需要给table标签添加border-collapse 属性。

      border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。

Answer 2

<style>
#test{border-collapse:collapse;border:1px solid #ddd;}
#test th,#test td{border:1px solid #ddd;}
</style>
<table id="test">
	<tr><th>姓名</th><td>Joy Du</td></tr>
	<tr><th>年龄</th><td>26</td></tr>
</table>

Answer 3

用背景模拟边框

将table背景设置颜色，然后将cellspacing="1"

再将td设置白色

边框的颜色其实是table的背景色

不懂追问

Answer 4

这个需要两个步骤，
第一要定义css把表格的边框合并；
第二定义当前这个表格中单元格的边框样式；

代码如下：

<style>
.tab{ border-collapse:collapse;}
.tab td{ border:solid 1px #000;}
</style>

<table class="tab">
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>