zoukankan      html  css  js  c++  java
  • 表格

    表格:
    表格的组成:由行 和 列组成,行和列交汇的叫做单元格
    行--tr
    单元格标签---td
    结构:
    table > tr > td

    <table>
    <tr>
      <th></th>
    </tr>
    <tr>
      <td><td>
    </tr>
    </table>
    

      

    caption表格的标题它是居中的
    表格相关(行内)属性:
    width---表格的宽度
    height---表格的高度
    border---表格的边框
    bordercolor--表格的边宽颜色
    cellspacing="数字"--设置单元格之间的距离
    cellpadding="数字"---设置内容到单元格边框的距离
    align="left|center|right"---如果align属性给table添加,那么是将表格设置在网页中的对齐方式
    想要文字在单元格中居中显示,只能将align属性给tr或者 td设置
    valign垂直的 top|middle|bottom
    注意点:当单元格没有内容的时候,单元格默认情况下会被挤压,想要所有单元格宽高一样,
    只能单独给单元格设置宽高

    合并的属性都给td添加
    行合并--rowspan="n",删除本行下面n-1行对应的td
    列合并---colspan="n" 删除本行里面的n-1个td

    CSS属性设置:
    边框合并:boder-collapse属性值:separate;(分开,默认)|collapse;(合并)

    table,td,th{
    border:1px solid #aaa; 
    font-size: 23px; 
    border-collapse:collapse;
    }

    边框间距border-spacing(前提是:border-collapse:separate;)

    table,td,th{
    border:1px solid #aaa; 
    font-size: 23px; 
    border-collapse:separate; 
    border-spacing: 45px;
    }

    设置表格标题的位置caption-side属性值:top;//默认|bottom;|left;|right;

    table,td,th{
    border:1px solid #aaa; 
    font-size: 23px; 
    border-collapse:separate; 
    border-spacing: 45px; 
    caption-side:bottom;
    }

    当单元格对象宽度超过单元格所定义的宽度时,可用table-layout:fixed保持表格宽度不被改变,属性值:auto(默认)fixed(宽度固定)

    table,td,th{
    border:1px solid #aaa;
    font-size: 23px; 
    border-collapse:separate; 
    border-spacing: 5px; 
    table-layout: fixed; 
    caption-side:top;
    }
  • 相关阅读:
    [Tips] 树莓派VNC登录
    [Tips] 联通宽带+华为路由器,如何进行NAT
    [Tips] 树莓派4B 风扇安装
    [Tips] 家庭树莓派,如何外网访问
    [Tips] 命令行获取设备的外网IP
    MySQL 如何让自增id设置为从1开始
    MySQL报错:Packet for query is too large (2,588 > 2,048).
    Java 实现 Timstamp 和 String 互相转换
    MySQL修改 mysql-bin 日志保存天数以及文件大小限制
    Linux Shell 中的年月日 时分秒
  • 原文地址:https://www.cnblogs.com/muyun123/p/11615080.html
Copyright © 2011-2022 走看看