5.编写HTML代码-表格 课件

资源下载
  1. 二一教育资源

5.编写HTML代码-表格 课件

资源简介

(共22张PPT)
5
表 格
Part five
1、先检查标签书写是否正确(双标记是否忘记结束标记)
2、属性及属性值是否正确,只能是数字的是否设置为百分比,中文的属性值必须加英文状态的引号,”宋体”body bady
3标记之间的嵌套,不能交叉标记



********
cellspacing
cellpaddingg
6、表格
表格格式
数据单元格










表格标题
表头单元格表头单元格
数据单元格数据单元格

功能:建立一个由表格标题和若干行列组成的表格,但当页面用了过多表格时,页面加载速度会受到一定的影响
...

...
表格中的行
表头单元格,内容自动加粗
创建一个表格
...
...
标记属性
属性 功能
width 设置表格的宽度,单位为像素或百分比
height 设置表格的高度,单位为像素或百分比
align 设置表格在页面中的水平对齐方式
background 设置表格的背景图片
bgcolor 设置表格的背景颜色
border 设置表格边框的宽度,单位为像素,不指定属性值时默认为1,省略该属性或指定该属性值为0时,不显示表格边框。
bordercolor 设置表格边框颜色
cellspacing 设置单元格之间的间距,单位为像素
cellpadding 设置单元格内容与单元格边界间的距离,单位为像素
6、表格
设置表格边框border
6、表格
设置表格边框的颜色:bordercolor
Bordercolorlight/bordercolordark
6、表格
设置表格的背景颜色或者背景图像
Bgcolor=颜色 background=图像路径/文件名
6、表格
设置表格的尺寸:width/height
取指为窗口的百分比或者像素
6、表格
设置表格的对齐位置:align
取指为left/right/center
6、表格
设置表格的格框线宽度:cellspacing
取指为像素,默认为2
6、表格
设置表格的框线与内容的间距:cellpadding
6、表格
设置表格的边框显示状态:frame
6、表格
显示整个表格边框

不显示表格边框

只显示表格的上下边框

只显示表格的左右边框

只显示上边框

只显示下边框

只显示左边框

只显示右边框

设置表格的边框显示状态:frame
6、表格
设置表格的分割线的显示状态:rules
6、表格
显示所有分格线

所有分割线不显示

只显示组与组的分隔线

只显示行与行的分隔线

只显示列与列额分隔线

1 2
3 4
5
标记属性
属性 功能 默认值
height 设置表格行的高度
align 设置表格行内容的水平对齐方式
valign 设置表格行内容的垂直对齐方式,取值为top/middle/bottom middle
bgcolor 设置表格行的背景颜色
bordercolor 设置表格行的边框颜色
6、表格
…. 设置表头的属性,属性与th标签一致
…… 设置表格其他单元格的共有属性,属性与TD标签一致

6、表格
表格的列分组
6、表格
标记 功能
表格按列分组
span 该组包含的列数
align 改组列中的对齐方式
Align属性定义所有夸列中单元格的内容水平方向的位置,center、right、left
标记 功能
标记属性
属性 功能
width 设置单元格的宽度,单位为像素或百分比
height 设置单元格的高度,单位为像素或百分比
align 设置单元格中数据的水平对齐方式 left center right
valign 设置单元格中数据的垂直对齐方式 top middle bottom
bgcolor bgcolor设置单元格的背景颜色
background 设置单元格的背景图片
bordercolor 设置单元格的边框颜色
rowspan 设置单元格在列内合并的行数
colspan 设置单元格在行内合并的列数
6、表格
表格的分组
标记 功能
表格的标题
align 标题位置 top bottom
作业:完成下发的TASK5中的作业
要求:利用记事本编辑网页,按照要求保存为HTML文件,自己预览后提交。有问题及时反馈练习。

展开更多......

收起↑

资源预览