Html 教程（5）表格标签

1. HTML 表格标签

标签	描述
`<table>`	定义表格
`<th>`	定义表格的表头
`<tr>`	定义表格的行
`<td>`	定义表格单元
`<caption>`	定义表格标题
`<colgroup>`	定义表格列的组
`<col>`	定义用于表格列的属性
`<thead>`	定义表格的页眉
`<tbody>`	定义表格的主体
`<tfoot>`	定义表格的页脚

表格结构语义标签：
colspan：跨列
rowspan：跨行
cellpadding：单元格内边距
cellspacing：单元格外边距
col 和 colgroup 用于便捷定义表格指定列的样式。

2. 标签常用属性

<table>：
border=“1” 表格边框的宽度
bordercolor="#fff" 表格边框的颜色
cellspacing=“5” 单元格之间的间距
width=“500” 表格的总宽度
height=“100” 表格的总高度
align=“right” 表格整体对齐方式 (参数有 left、center、right)
bgcolor="#fff" 表格整体的背景色
<tr>标签的常用属性:
bgcolor="#fff" 行的颜色
align=“right” 行内文字的水平对齐方式 (参数有left、center、right)
valign=“top” 行内文字的垂直对齐方式 (参数有top、middle、bottom)
<td>、<th> 标签的常用属性:
width=“500” 单元格的宽度，设置后对当前一列的单元格都有影响
height=“100” 单元格的高度，设置后对当前一行的单元格都有影响
bgcolor=“fff” 单元格的背景色
align=“right” 单元格文字的水平对齐方式 (参数left、center、right)
rowspan=“3” 合并垂直水平方向的单元格
colspan=“3” 合并水平方向单元格
valign=“top” 单元格文字的垂直对齐方式 (参数middle、bottom、top)

3. eg.

<h4 style="text-align:center">课程表</h4>
<table border="1" cellpadding="10" width="100%"><tr><th colspan="2">时间\日期</th><th>一</th><th>二</th><th>三</th><th>四</th><th>五</th></tr><tr><th rowspan="2">上午</th><th>9:30-10:15</th><th>语文</th><th>语文</th><th>语文</th><th>语文</th><th>语文</th></tr><tr><th>10:25-11:10</th><th>语文</th><th>语文</th><th>语文</th><th>语文</th><th>语文</th></tr><tr><th colspan="7"></th></tr><tr><th rowspan="2">下午</th><th>14:30-15:15</th><th>语文</th><th>语文</th><th>语文</th><th>语文</th><th>语文</th></tr><tr><th>15:25-16:10</th><th>语文</th><th>语文</th><th>语文</th><th>语文</th><th>语文</th></tr></table>

Html 教程（5）表格标签相关推荐

phpexcel中文教程-设置表格字体颜色背景样式、数据格式、对齐方式、添加图片、批注、文字块、合并拆分单元格、单元格密码保护
转载连接:http://www.cnblogs.com/huangcong/p/3687665.html phpexcel中文教程-设置表格字体颜色背景样式.数据格式.对齐方式.添加图片.批注.文字块 ...
HTML表格标签(table)
table标签简介: tabale标签是表格标签,html中较为常用的标签之一,主要用来制作表格,完成一些对比和统计工作 table具体使用: 1.创建一个表格 2.tr.td.th标签的作用: 2. ...
讲给后台程序员看的前端系列教程(02)——HTML5标签(1)
C语言自学完备手册(33篇) Android多分辨率适配框架 HTML5前端开发实战系列教程 MySQL数据库实操教程(35篇图文版) 推翻自己和过往--自定义View系列教程(10篇) 走出思维困境 ...
html页面的th标签合并,Table tr th td html表格标签
Table tr th td html表格标签教程-- html table tr td�?strong>html table tr th表格布局标签教程�?/p> 学习DIV CSS回头 ...
HTML的表格标签，列表标签，表单标签，HTML5有哪些新特性
HTML的表格标签,列表标签,表单标签,HTML5有哪些新特性欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可博客园主页:博客园主页-冰山一树Sankey CSDN主页: ...
Destoon教程之系统标签调用大全【持续更新】
Destoon教程之系统标签调用大全 [持续更新]整理前先列大纲: 一.全局通用标签调用字段语法({$DT[字段名]}) 网站名称:{$DT[sitename]} 网站地址:{DT_PATH} ...
html table表格标签内容如何居中显示？表格的align属性的用法介绍
本篇文章主要的介绍了关于HTML 表格table标签的居中使用,还有关于align属性在table表格标签中的使用方法,可以帮助表格对齐和表格中的文本对齐.接下来让我们来看看这篇文章吧. 首先我们先来 ...
html表格重置标签,HTML——表格标签
存在即是合理的. 表格的现在还是较为常用的一种标签,但不是用来布局,常见处理.显示表格式数据. 表格的应用场景: 1 创建表格在HTML网页中,要想创建表格,就需要使用表格相关的标签.创建表格的基本 ...
html表格标签模板实现跨行和跨列
网站首页显示页面1.表格标签<table border="" width="" height="" align="" ...

Html 教程（5）表格标签

Html 教程（5）表格标签相关推荐

最新文章

热门文章

Html 教程 （5） 表格标签

Html 教程 （5） 表格标签相关推荐

最新文章

热门文章

Html 教程（5）表格标签

Html 教程（5）表格标签相关推荐