html5中制作表格,(html5表格的制作.doc

(html5表格的制作

教学项目五 HTML中表格的制作

【教学内容】

讲解HTML中制作表格的标志

【教学目的】

使学生掌握简单表格的制作

【教学重点】

表格中单元格的合并操作

【教学难点】

理解属性rowspan与colspan的含义

【教学方式】

案例分析式、项目教学

【教学参考】

1．HTML网页制作教程材义语编著铁道出版社

2、HTML基础与实例程耀编著电子工业出版社

表格基本标志

(1)

(2)

(3)

(4)

用来创建一个表格框架创建表格的一行创建表格一行中的一个单元格

它们的对应关系如下:

第一行第一列

第一行第二列

第一行第三列

第一行第四列

用于定义表格头

在网页中制作表格:

表格制作表格例子

		F
F	F
	F	F

二、

标志中配合使用的属性

1. border 设置表格边框的宽度

bgcolor 设置表格背景颜色

3. background 设置表格背景图片

4. width 设置表格宽度

5. height 设置表格高度

6. cellspacing 设置表格内框线宽度

7. cellpadding 设置表格内文字与表格边框线的间距

8. align 设置表格水平对齐方式

9. valign 设置表格垂直对齐方式

10.bordercolor 设置表格边框颜色

11.bordercolorlight 设置表格明亮边框颜色

12.bordercolordark 设置表格暗边框颜色

例二、制作乘法口诀表

表格制作乘法口诀表

cellpadding=10 bordercolor=#ff0000 bordercolordark=#00ff00>

6×6=36 6×7=427×7=49 6×8=487×8=568×8=64 6×9=547×9=638×9=729×9=81

表格标题的设定

语法：

标题

说明：

valign=top 标题置于表格上方

valign=bottom 标题置于表格下方

align=left 居左

align=right 居右

align=center 居中

表格中单元格的合并

在

或标志中加入属性colspan 和rowspan，可以实现单元格的合并

colspan: 指定单元格合并占用的列数

rowspan: 指定单元格

html5中制作表格,(html5表格的制作.doc相关推荐

怎么在html5中插入vr,HTML5：2分钟给VR场景加交互
VR场景让用户以360度的方式体验品牌.产品或服务 HTML5:网页如何播放VR视频中介绍了使用play2VR能轻松为网页增加VR场景. 想象预约看房,售楼小姐带领客户漫步小区,选择户型,参观样板房, ...
html5 中keygen用法,HTML5: keygen 标签
在线示例带有 keygen 字段的表单: 示例html> 基础教程(nhooo.com) 用户名: 加密: 注意: Internet Explorer 不支持 keygen 标签. 测试看看 ...
html5中的h1,HTML5语义 - 产品列表中的h1用法
我们正在讨论在产品列表页面中使用h1标签.有几个方面可以用来过滤产品.HTML5语义 - 产品列表中的h1用法技术上明智的做法是使用多个h1标签,如果这些标签被封装在section或article中 ...
html5中图片热点,HTML5 创建热点图
通过HTML5 canvas画布创建简单的热点图,当鼠标划过时产生热点,停留时间越长,热点亮度越高. 下面是HTML部分: #heatmap{background-image:url("ma ...
怎么在html5中加入视频,html5怎么嵌入视频
首先我们要知道HTML5是支持直接在浏览器中播放音频和视频文件的,不需要使用 adobe flash 插件. 插件缺点:插件是令浏览器崩溃的主要原因之一,特别是 flash,存在着很多问题. (视频学 ...
html5中自动播放,HTML5自动播放一次(HTML5 autoplay once)
HTML5自动播放一次(HTML5 autoplay once) 以下javascript函数提供并自动播放音频文件(通过HTML 5音频标签),在6秒时切换mp3播放并从头开始循环+自动播放音频. ...
html5中audio兼容性,HTML5 Audio API与兼容性
备用(当浏览器不支持audio时显示的内容) audio 的控制函数主要有: 控制函数功能说明 load() 加载音频.视频软件,通常不必调用,除非是动态生成的元素,用来在播放前预加 ...
HTML5中CLASS选择器,html5 class选择器
html5的确给我们带来惊喜, 新增的dom api-类选择器那么怎样使用呢?看下面的代码吧..... JavaScriptvar els = document.getElementsByClass ...
html5中preclass,为什么HTML5建议把代码元素放在pre？
< code>仅表示"计算机代码的片段".它最初被认为是简单的代码片段,如i或< code&gt ;. < pre> "表示预格式化 ...
html表单中阴影,html5中input表单加边框,阴影效果.doc
文档介绍: CSS:input:focus{border-color:#99;}获取焦点时改变颜色focus能同时改变宽度长度背景色--.form,p(margin-bottom:30px;margi ...

html5中制作表格,(html5表格的制作.doc

html5中制作表格,(html5表格的制作.doc相关推荐

最新文章

热门文章