HTML表格

HTML表格

今日内容

• 表格格式

• 表格的分解

• 表格的常用属性、

• 使用快捷键

• 案列

 

表格的格式

Herder

 

表格的分解

• table 表格

• tr 行

• td 列

 

表格常用的属性

• 边框

  • border=""

• 单元格边距

  • cellspacing=“0”

  • 消除单元格默认边距

• 单元格填充

  • 设置单元格内容与边框的内容

  • cellpadding=""

• 行高

  • height=“30”

  • 设置单元格的行高

  • 给tr

• 列宽

  • width=“40”

  • 设置单元格的列宽

  • 给td

  • 对于同一列的单元格，如果设置了不同的宽度，最终的宽度取决于最大的宽度

• 背景色

  • bgcolor=“” background 背景

  • 可以给单元格（行，整个表格）设置背景色

• 边框颜色

  • border=“”

  • 只能给table设置

• 背景

  • background=“图片地址”

  • 给表格设一个背景图片

  • 有了background，bgcolor会失效

  使用快捷键生成表格

  • table[border="1px" cellspacing="0" cellpadding=""]>tr[height="60px"]8>td[100px]{$}8

  • 属性 []

  • 值{}，跟在td后面

  • 表达式之间不要使用空格

• 表格对齐方式

  • align=“center”

• 块选操作

  • 按住alt，拖动光标

单元格合并

• 列合并 colspan=“合并的列数”，将合并多余的单元格删除

• 行合并 rowspan=“合并的行数”，合并后将多余的单元格删除

• 表头th和tb的区别

  • th文字会加粗居中

  • thead>tr>th

• tbody 主体内容

• tfoot [页脚]

列分组标签

• <colgroup> <col span="3" style="background-color: blue;"> <col span="3" style="background-color: red;"> </colgroup>

• 对整行进行操作