宝塔服务器面板,一键全能部署及管理,送你10850元礼包,点我领取

这篇文章给大家分享的是有关HTML的table属性有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

  什么是表格&表格的作用

  什么是表格:由一些被称之为单元格的矩形框按照从左到右从上到下的顺序排列到一起组成的

  表格的作用:以一定的结构来显示信息的。

  如何使用table表格

  定义表格:<table></table>

  创建表行:<tr></tr>

  创建列(单元格):<td></td>

  注意:默认情况下,每行中的列数是统一的。

  table表格的特点:

  1、独占一行

  2、宽度自适应(由内容来决定)

  table表格属性:

  <table>属性

  width:设置表格宽度

  height:设置表格高度

  align:设置表格在其父元素中的水平对齐方式,取值:left,center,right

  border:边框,边框宽度,以px为单位的数值,px可以省略

  cellpadding:单元格内边距

  单元格边框与内容之间的距离

  cellspacing:单元格外边距

  单元格与单元格之间或者单元格与表格之间的距离

  bgcolor:背景颜色

  <tr>属性

  1.align:该行的内容水平对齐方式

  2.valign:该行的内容垂直对齐方式,取值:top,middle,bottom

  3.bgcolor该行的文本颜色

  <td>属性

  width

  height

  align

  valign

  bgcolor

  colspan设置单元格跨列

  rowspan设置单元格跨行

  3、table表格中的其他标记

  1.<caption></caption>

  作用:为表格定义标题

  位置:表格正上方居中显示

  <table>

  <caption>标题</caption>

  <tr>

  <td></td>

  <td></td>

  </tr>

  </table>

  2.行标题或列标题

  列标题:第一行中的每一列,加粗,水平居中的效果显示

  行标题:每行里面的第一列,加粗,水平居中的效果显示

  行(列)标题:<th></th>

  <th></th>作用与<td></td>一模一样

  table边框合并:

  属性:border-collapse

  取值:

  1.separate默认值,分离边框模式

  2.collapse边框合并模式

  table边框边距:

  1.作用:设置相邻单元格边框之间的距离(类似于cellspacing)

  2.属性:border-spacing

  取值:

  1.取1个值:表示水平和垂直间距相等

  2.取2个值:第一个值表示的水平间距

  第二个值表示的垂直间距

  两个值之间用空格隔开

  3.要求

  border-collapse必须为separate

  必须为分离边框模式时有效

  隐藏的显示效果:

  属性:visibility:collap:se

  用在表格元素上,删除一行或一列,不影响表格整个布局