css设置表格样式的方法
                                            这篇文章主要介绍css设置表格样式的方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

创新互联公司是一家专注于成都网站制作、成都网站设计与策划设计,宜章网站建设哪家好?创新互联公司做网站,专注于网站建设十多年,网设计领域的专业建站公司;建站业务涵盖:宜章等地区。宜章做网站价格咨询:18982081108
1、一个简单的表格
table.html
    
    表格样式 
    
  
  
      课程表 
        
            星期\课程 
            星期一 
            星期二 
            星期三 
            星期四 
            星期五 
       
      
            1-2节 
            数学 
            语文 
            化学 
            英语 
             英语 
       
      
            3-4节 
            英语 
            物理 
            化学 
            英语 
             体育 
       
      
            5-6节 
            数学 
            物理 
            体育 
            化学 
            美术 
       
      
            7-8节 
            数学 
            美术 
            化学 
            英语 
            体育 
       
      
            9-10节 
            生物 
            美术 
            生物 
            英语 
            物理 
       
    
   
  table.css
table,td,th{
    border:1px solid #aaa;    
    font-size: 23px;
    }2、边框合并:boder-collapse
属性值:
separate;(分开,默认)
collapse;(合并)
table.css
table,td,th{
    border:1px solid #aaa;    
    font-size: 23px;    
    border-collapse:collapse;
    }3、边框间距border-spacing(前提是:border-collapse:separate;)
table.css
table,td,th{
    border:1px solid #aaa;    
    font-size: 23px;    
    border-collapse:separate;    
    border-spacing: 45px;
    }4、设置表格标题的位置caption-side
属性值:
        top;//默认
        bottom;
        left;
        right;
table.css
table,td,th{
    border:1px solid #aaa;    
    font-size: 23px;    
    border-collapse:separate;    
    border-spacing: 45px;    
    caption-side:bottom;
    }5、当单元格对象宽度超过单元格所定义的宽度时,可用table-layout:fixed保持表格宽度不被改变
属性值:auto(默认)
        fixed(宽度固定)
table.css
table,td,th{
    border:1px solid #aaa;
        font-size: 23px;    
        border-collapse:separate;    
        border-spacing: 5px;    
        table-layout: fixed;    
        caption-side:top;
        }以上是css设置表格样式的方法的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!
文章名称:css设置表格样式的方法
本文来源:http://www.cqwzjz.cn/article/ppogsc.html

 建站
建站
 咨询
咨询 售后
售后
 建站咨询
建站咨询 
 