table白色粗边框改为黑色细边框的方法

刚学table标签时，给table加上边框后出现了一个很难看的白色边框，如下所示。

这个奇怪的白色边框出现的原因也很简单，这里我给table设置的是border=“1px”,结果就是整个table和table内的块状格子都添加了边框。那么如何将它修改成看起来很舒服的效果呢。

1.内外边框同时修改

例如下面这个效果图：

我们可以考虑这么做，我们可以利用外边框和内边框的距离，将这些距离都填充为黑色就可实现。将每个单元小格的背景颜色设置为白色，然后再将整个table的背景色设置为黑色即可实现。
下面是代码部分：

	
		
		
		
	
	
		

			

				
1-1
				
1-2
				
1-3
			
			

				
2-1
				
2-2
				
2-2
			
			

				
3-1
				
3-2
				
3-3
			
		
	

2.只修改外边框

这里我们可以用table自带属性rules来实现，将rules的值设置为all（将内侧行列边框设置为可见）。
这里要说明一下，rules是专门只对内边框作用的属性，table再添加rules后，table的border属性就只对外边框起作用。而我们table默认是没有边框的，在不设置border只设置rules的情况下内边框依然会显示。
所以，当我们在table中设置边框和rules="all"之后，就会变成如下效果：

调整一下border的值（这里设置为2px）就可以达到大部分人想要的效果：

代码如下：

	
		
		
	
	
		

			

				
1-1
				
1-2
				
1-3
			
			

				
2-1
				
2-2
				
2-2
			
			

				
3-1
				
3-2
				
3-3