码迷,mamicode.com
首页 > 其他好文 > 详细

03 表格

时间:2020-05-08 18:42:29      阅读:80      评论:0      收藏:0      [点我收藏+]

标签:一个   默认   头部   ext   height   必须   居中   属性   跨行   

1. 表格 table

<table>
  <tr>
    <td>单元格内的文字</td>
    ...
  </tr>
  ...
</table>
  • table:表格标签
  • tr:表格中的行,必须嵌套在 <table> 标签中
  • td:表格中的单元格,必须嵌套在 <tr> 标签中,用来存储数据

2. 表格属性

属性名 含义
border 表格的边框 px(默认0)
cellspacing 单元格与单元格之间的距离 px(默认2)
cellpadding 单元格内容与单元格边框的距离 px(默认1)
width 表格的宽度 px
height 表格的高度 px
align 表格在网页中的水平对齐方式 left、center、right

无边框:三参为0,border 、cellpadding 、cellspacing 为 0


3. 表头单元格 th

一般表头单元格位于表格的第一行或第一列,并且文本加粗居中

语法:用表头标签<th> </th>替代相应的单元格标签<td> </td>


4. 表格标题 caption

定义表格标题,标题会被居中且显示于表格之上

语法:写在 <table> 之下 <tr> 之上

<table>
   <caption>我是表格标题</caption>
   <tr></tr>
</table>

5. 合并单元格

1. 确定合并方式 2. 找到的目标单元格 3. 合并语法
跨列 左边第一个 <td rowspan="合并的数量" >
跨行 上方第一个 <td colspan="合并的数量" >

注意:最后删除多余的单元格


6. 表格划分结构

可以更好的分清表格结构,以下标签都是放到 table 标签中包裹着 tr td

表格头部:<thead> </thead>(内部必须有 <tr> 标签)

表格主体:<tbody> </tbody>

表格脚注:<tfoot> </tfoot>


03 表格

标签:一个   默认   头部   ext   height   必须   居中   属性   跨行   

原文地址:https://www.cnblogs.com/wzos/p/12851828.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!