table中cellspacing与cellpadding区别

这篇文章主要介绍了table中cesllspacing与cellpadding的区别详解，文中通过示例代码介绍的非常细致，对大家的学习或者工作拥有一定的参照 学习价值，需要的伴侣们下面随着小编来一起学习学习吧

table有哪些？它是由一个个cell单元格形成的，在表格中，的个数取决于每行中包裹的cell单元格个数！此外，默许table表格在没有增加css样式

首先个单元格

测试1

测试2

测试3

第二个单元格

测试1

测试2

测试3

第三个单元格

测试1

测试2

测试3

比拼代码，最上面的两个表格只要cellspacing的设定不一样，一个为”0“，一个为”20“，显示的效果就是首先个表格的每个单元格之间的距离为0，第二个表格的每个单元格之间的距离为20；延长下：第二个表格与第三个表格一致，但是第三个表格没有设定cellspacing，我们发明这个border-spacing: 20px;与cellspacing="20" 的效果同样同样的，e.g小结：cellspacing属性用来指定表格各单元格之间的闲暇。此属性的参数值是数字，表示单元格间隙所占的像素点数。

    
        
        
        
    
    
        

            

                
我是高兴的cell表格
                
我是高兴的cell表格
                
我是高兴的cell表格
            
        
        

            

                
我是高兴的cell表格
                
我是高兴的cell表格
                
我是高兴的cell表格
            
        
    

代码展现：

    
        
        
        
    
    
    

        
正常展现：一行三列
        

            
说点啥了,不晓得
            
说点啥了,不晓得
            
说点啥了,不晓得
        
    
    

        
此刻要展现一行二列,怎么办？colspan跨列合并
        

            
说点啥了,不晓得
            
说点啥了,不晓得
            
        
    
    
    

        
正常展现：二行二列
        

            
说点啥了,不晓得
            
说点啥了,不晓得
        
        

            
说点啥了,不晓得
            
说点啥了,不晓得
        
    
    

        
此刻要展现一行二列,怎么办?rowspan跨行合并
        

            
说点啥了,不晓得
            
说点啥了,不晓得
        
        

            
            
说点啥了,不晓得
        
    
    

拓展二：怎样合并表格边框？border-collapse: collapse;

    
    

        

            

                
单元格1
                
单元格2
                
单元格3
            
        
    

最后chrome阅读器中，系统默许的表格边框色彩grey，边框间距为2等等

/* user agent stylesheet */
        /* table {
            display: table;
            border-collapse: separate;
            border-spacing: 2px;
            border-color: grey;
        } */
        
/*         border="1"默许等于border="1px"
        border-top-width: 1px;
        border-right-width: 1px;
        border-bottom-width: 1px;
        border-left-width: 1px; */
        
/*        bordercolor返回或设定对象的边框色彩
        bordercolor:W3C - String 
        Specifies the color of the border of the element. Specify either a color name or RGB color code. 
*/

举荐教程：《CSS教程》

以上就是table 中 cellspacing 与 cellpadding 区另外细致内容，更多请关注 百分百源码网 其它相干文章！