HTMLCSSJavaScript教学教案讲解

精品文档 1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载1欢迎下载 HTML CSS JavaScript 网页制作 教学教案 第1讲 课时内容HTML 基础授课时间80 分钟课时2 2 教学内容 在当今社会中 网络已成为人们生活的一部分 网页设计技术已成为学习计算机的 重要内容之一 目前大部分网页都采用可视化网页编辑软件来制作的 但是无论采用 哪一种网页编辑软件 最后都是将所设计的网页转化为 HTML HTML 是搭建网页的基 础语言 如果不了解 HTML 就不能灵活地实现想要的网页效果 本章就来介绍 HTML 的基本概念和编写方法以及浏览 HTML 文件的方法 使读者对 HTML 有个初步的了解 从而为后面的学习打下基础 教学重点 了解 HTML 的基本概念 掌握 HTML 文件的编写方法 掌握使用浏览器浏览 HTML 文件 内容大纲 1 1 HTML 的基础概念 1 1 1 HTML 简介 1 1 2 HTML 文件的 基本结构 1 1 3 认识 HTML 标记 1 21 2 HTMLHTML 文件的编写方法文件的编写方法 1 2 1 使用笔记本手工编写 HTML 1 2 2 使用 Dreamweaver 编写 HTML 文件 1 31 3 使用浏览器浏览使用浏览器浏览 HTMLHTML 文件文件 1 3 1 查看页面效果 1 3 2 查看源文件 1 41 4 练习题练习题 精品文档 2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载2欢迎下载 第2讲 课时内容HTML 基本标记授课时间80 分钟课时2 2 教学内容 一个完整的 HTML 文档必须包含 3 个部分 一个由元素定义的文档版本信息 一个由定义各项声明的文档头部和一个由定义的文档主体部分 作为各种声明信息的包含元素出现在文档的顶端 并且要先于出现 而 用来显示文档主体内容 文字是网页中最基本的信息载体 文字通过不同的排版方式 不同的设计风格排列在网页上 提供了丰富的信息 文字的控制与布局在网页设计中 占了很大比例 因此掌握好文字的使用 对于网页制作来说是最基本的 本章就来讲 解这些基本标记的使用 这些都是一个完整的网页必不可少的 教学重点 掌握 HTML 头部标记 掌握标题标记 掌握元信息标记 掌握页面的主体标记 掌握页面注释标记 内容大纲 2 1 HTML 头部标记 head 2 2 标题标记 title 2 3 元信息标记 meta 2 3 1 设置页面关键字 2 3 2 设置页面说明 2 3 3 定义编辑工具 2 3 4 设置作者信息 2 3 5 设置网页文字及语言 2 3 6 设置网页的定制跳转 2 4 页面注释标记 2 5 标题字 2 5 1 标题字标记 h 2 5 2 标题字对齐属性 align 2 6 段落标记 2 6 1 段落标记 p 2 6 2 换行标记 br 2 6 3 不换行标记 nobr 2 7 水平线 2 8 其他标记 2 8 1 插入空格 2 8 2 插入特殊符号 2 9 练习题 精品文档 3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载3欢迎下载 第3讲 课时内容建立超链接授课时间80 分钟课时2 2 教学内容 超级链接是 HTML 文档的最基本特征之一 超级链接的英文名是 hyperlink 它能够 让浏览者在各个独立的页面之间方便地跳转 每个网站都是由众多的网页组成 网页 之间通常都是通过链接方式相互关联的 超链接的范围很广 可以将文档中的任何文 字及任意位置的图片设置为超级链接 超链接有外部链接 电子邮件链接 锚点链接 空链接 脚本链接 教学重点 了解超级链接的基本知识 掌握内部链接 掌握锚点链接 掌握外部链接 内容大纲 3 1 超链接的基本知识 3 1 1 绝对路径 3 1 2 相对路径 3 2 内部链接 3 2 1 认识内部链接 3 2 2 链接的目标窗口 3 2 3 建立锚点 3 3 锚点链接 3 3 1 建立同一页面中的锚点 3 3 2 建立其他页面中的锚点 3 4 外部链接 3 4 1 链接到外部网站 3 4 2 链接到 E mail 3 4 3 链接到 FTP 3 4 4 链接到 Telnet 3 4 5 下载文件 3 5 练习题 精品文档 4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载4欢迎下载 第4讲 课时内容使用图像授课时间80 分钟课时2 2 教学内容 图像是网页中不可缺少的元素 巧妙地在网页中使用图像可以为网页增色不少 网页 美化最简单 最直接的方法就是在网页上添加图像 图像不但使网页更加美观 形象 和生动 而且使网页中的内容更加丰富多彩 利用图像创建精美网页 能够给网页增 加生机 从而吸引更多的浏览者 教学重点 了解图像的格式 掌握插入图像的方法 掌握图像的超链接 内容大纲 4 1 图像的格式 4 2 插入图像 4 2 1 插入图像标记 img 4 2 2 图像的源文件 src 4 2 3 图像的提示文字 alt 4 2 4 图像的宽度和高度 width heught 4 3 图像的超链接 4 3 1 图像的超链接 4 3 2 图像热区链接 4 4 练习题 精品文档 5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载5欢迎下载 第5讲 课时内容使用列表授课时间80 分钟课时2 2 教学内容 列表是一种非常有用的数据排列方式 它以列表的形式来显示数据 HTML 中共有 3 种 列表 分别是无序列表 有序列表和定义列表 无序列表的所有列表项目之间没有先 后顺序之分 有序列表的列表项目是有先后顺序之分的 定义列表是一组带有特殊含 义的列表 一个列表项目里包含条件和说明两部分 教学重点 了解列表标记概述 掌握有序列表 掌握无序列表 掌握定义列表 掌握菜单列表 内容大纲 5 1 认识列表标记 5 2 有序列表 5 2 1 游戏列表 ol 5 2 2 有序列表的序号类型 type 5 2 3 有序列表的起始数值 start 5 4 练习题 精品文档 6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载6欢迎下载 第6讲 课时内容使用表格授课时间80 分钟课时2 2 教学内容 表格是网页制作中使用最多的工具之一 在制作网页时 使用表格可以更清晰地排列 数据 但在实际制作过程中 表格更多地用在网页布局定位上 很多网页都是以表格 布局的 这是因为表格在文本和图像的位置控制方面都有很强的功能 灵活 熟练地 使用表格 在网页制作时会有如虎添翼的感觉 教学重点 掌握创建表格 掌握设置表格基本属性 掌握设置表格的边框 掌握设置表格背景 掌握设置表格的行属性 掌握调整单元格属性 内容大纲 6 1 创建表格 6 1 1 表格的基本构成 table tr td 6 1 2 设置表格的标题 caption 6 1 3 表头 th 6 2 表格基本属性 6 2 1 表格宽度 width 6 2 2 表格高度 height 6 2 3 表格对齐方式 align 6 3 表格的边框 6 3 1 表格边框宽度 border 6 3 2 表格边框颜色 bordercolo r6 3 3 内框宽度 cellspacing 6 3 4 表格内文字与边框间距 cellpadding 6 4 表格背景 6 4 1 表格背景颜色 bgcolor 6 4 2 表格背景图像 6 5 表格的行属性 6 5 1 高度控制 height 6 5 2 边框颜色 bordercolor 6 5 3 行背景 bgcolor background 6 5 4 行文字的水平对齐方式 align 6 5 5 行文字的垂直对齐方式 valign 6 6 单元格属性 6 6 1 单元格大小 width height 6 6 2 水平跨度 colspan 6 6 3 垂直跨度 rowspan 6 6 4 对齐方式 align valign 6 6 5 单元格的背景颜色 精品文档 7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载7欢迎下载 6 6 6 单元格的边框颜色 bordercolor 6 6 7 单元格的亮边框 bordercolorlight 6 6 8 单元格的暗边框 bordercolordark 6 6 9 单元格的背景图像 background 6 7 表格的结构 6 7 1 表格的表首标记 6 7 2 表格的表主体标记 6 7 3 表格的表尾标记 6 8 练习题 精品文档 8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载8欢迎下载 第7讲 课时内容使用列表授课时间80 分钟课时2 2 教学内容 表单的用途很多 在制作网页 特别是制作动态网页时常常会用到 表单主要用来收 集客户端提供的相关信息 使网页具有交互功能 在网页制作的过程中 常常需要使 用表单 如进行会员注册 网上调查和搜索等 访问者可以使用如文本域 列表框 复选框以及单选按钮之类的表单对象输入信息 然后单击某个按钮提交这些信息 教学重点 表单标记 插入表单对象 菜单和列表 文本域标记 id 标记 内容大纲 7 1 表单标记 form 7 1 1 提交表单 action 7 1 2 表单名称 name 7 1 3 传送方式 method 7 1 4 编码方式 enctype 7 1 5 目标显示方式 target 7 2 插入表单对象 7 2 1 文字字段 text 7 2 2 密码域 password 7 2 3 单选按钮 radio 7 2 4 复选框 checkbox 7 2 5 普通按钮 button 7 2 6 提交按钮 submit 7 2 7 重置按钮 reset 7 2 8 图像域 images 7 2 9 隐藏域 hidden 7 2 10 文件域 file 7 3 菜单和列表 7 3 1 下拉菜单 7 3 2 列表项 7 4 文本域标记 textarea 7 5 id 标记 7 6 创建表单实例 7 7 练习题 精品文档 9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载9欢迎下载 第8讲 课时内容添加多媒体授课时间80 分钟课时2 2 教学内容 教学内容 在网页中 除了之前讲到的可以插入文本和图像外 还可以插入动画 声 音 视频等媒体元素 如滚动效果 Flash 及 Midi 声音文件等 通过对本章的学习 读者可以学习到多媒体文件的使用 从而丰富网页的效果 吸引浏览者的注意 教学重点 掌握设置滚动效果 掌握插入多媒体文件 内容大纲 8 1 设置滚动效果 8 1 1 滚动标记 marquee 8 1 2 滚动方向 direction 8 1 3 滚动方式 behavior 8 1 4 滚动速度 scrollamount 8 1 5 滚动延迟 scrolldelay 8 1 6 滚动循环 loop 8 1 7 滚动范围 width height 8 1 8 滚动背景颜色 bgcolor 8 1 9 空白空间 hspace vspace 8 2 插入多媒体文件 8 2 1 插入 flash 动画 8 2 2 插入音频和视频文件 8 3 练习题 精品文档 10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载10欢迎下载 第9讲 课时内容HTML5 入门基础授课时间80 分钟课时2 2 教学内容 HTML5 是一种网络标准 相比现有的 HTML4 01 和 XHTML 1 0 可以实现更强的页面 表现性能 同时充分调用本地的资源 实现不输于 app 的功能效果 HTML5 带给了浏 览者更好的视觉冲击 同时让网站程序员更好的与 HTML 语言 沟通 虽然现在 HTML5 还没有完善 但是对于以后的网站建设拥有更好的发展 教学重点 认识 HTML5 掌握 HTML5 与 HTML4 的区别 掌握 HTML5 新增的元素和废除的元素 熟悉新增的属性和废除的属性 掌握创建简单的 HTML5 页面 内容大纲 9 1 认识 HTML5 9 2 HTML5 与 HTML4 的区别 9 2 1 HTML5 的语法变化 9 2 2 HTML5 中的标记方法 9 2 3 HTML5 语法中的 3 个要点 9 2 4 HTML5 与 HTML4 在搜索引擎优化的对比 9 3 HTML5 新增的元素和废除元素 9 3 1 新增的结构元素 9 3 2 新增块级元素 9 3 3 新增的行内的语义元素 9 3 4 新增的嵌入多媒体元素与交互性元素 9 3 5 新增的 input 元素的类型 9 3 6 废除的元素 9 4 新增的属性和废除的属性 9 4 1 新增的属性 9 4 2 废除的属性 9 5 练习题 精品文档 11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载11欢迎下载 第10讲 课时内容 HTML5 的结构授课时间80 分钟课时2 2 教学内容 在 HTML5 的新特性中 新增的结构元素主要功能就是解决之前在 HTML4 中 Div 漫天飞 舞的情况 增强网页内容的语义性 这对搜索引擎而言 将更好识别和组织索引内容 合理地使用这种结构元素 将极大地提高搜索结果的准确度和体验 新增的结构元素 从代码上看 很容易看出主要是消除 Div 即增强语义 强调 HTML 的语义化 教学重点 新增的主体结构元素 新增的非主体结构元素 内容大纲 10 1 新增的主体结构元素 10 1 1 article 元素 10 1 2 section 元素 10 1 3 nav 元素 10 1 4 aside 元素 10 2 新增的非主体结构元素 10 2 1 header 元素 10 2 2 header 元素 10 2 3 footer 元素 10 2 4 address 元素 10 3 练习题 精品文档 12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载12欢迎下载 第11讲 课时内容HTML5 开发实战授课时间80 分钟课时2 2 教学内容 在过去的 10 年里 网页设计师使用 Flash JavaScript 或其他复杂的软件和技术来 创建网站 现在可以使用 HTML5 实现交互式服务 单页 UI 交互式游戏 复杂业务应 用 凭借对标准驱动的移动应用开发的支持 以及各种强大特性 HTML5 迎来了它的 黄金时代 本章就来介绍 HTML5 开发实战 教学重点 掌握 HTML5 视频 video 掌握 HTML5 音频 Audio 掌握 HTML5 地理定位 掌握 HTML5 画布 canvas 掌握 HTML5 SVG 内容大纲 11 1 HTNL5 视频 video 11 1 1 video 概述 11 1 2 在网页中添加视频文件 11 1 3 链接不同的视频文件 11 2 HTML5 音频 Audio 11 2 1 Audio 元素简介 11 2 2 隐藏 audio 播放器 11 2 3 使用 audio 元素的事件 11 3 HTML5 地理定位 11 3 1 地理定位方法 11 3 2 处理拒绝和错误 11 3 3 在地图上显示你的位置 11 4 HTML5 画布 Canvas 11 4 1 canvas 元素 11 4 2 基本的绘图操作 11 4 3 线性渐变 11 4 4 径向渐变 11 4 5 绘制精美时钟 11 5 HTML5SVG 11 5 1 SVG 概述 11 5 2 图形绘制 11 5 3 文本与图像 11 5 4 笔画与填充 11 5 5 动画 11 6 练习题 精品文档 13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载13欢迎下载 第12讲 课时内容使用 CSS 样式表授课时间80 分钟课时2 2 教学内容 通过 CSS 样式定义 可以将网页制作得更加绚丽多彩 采用 CSS 技术 可以有效地对 页面的布局 字体 颜色 背景和其他效果实现更加精确地控制 用 CSS 不仅可以做 出令浏览者赏心悦目的网页 还能给网页添加许多特效 教学重点 了解 CSS 简介 掌握 CSS 的使用 CSS 的字体属性 颜色及背景属性 文本属性 边距与填充属性 边框属性 定位属性 列表属性 光标属性 滤镜属性 内容大纲 12 1 认识 CSS 12 2 使用 CSS 12 2 1 CSS 的基本语法 12 2 2 添加 CSS 的方法 12 3 字体属性 12 3 1 字体 font family 12 3 2 字号 font size 12 3 3 字体风格 font style 12 3 4 加粗字体 font weight 12 3 5 小写字母转为大写 font variant 12 3 6 字体复合属性 12 4 颜色和背景属性 12 4 1 颜色属性 color 12 4 2 背景颜色 background color 12 4 3 背景图像 background image 12 4 4 重复背景图像 background repeat 12 4 5 背景附件 background attachment 12 4 6 背景位置 background position 12 4 7 背景复合属性 background 12 5 段落属性 12 5 1 单词间隔 word spacing 12 5 2 字符间隔 letter spacing 12 5 3 文字修饰 text decoration 12 5 4 垂直对齐方式 vertical align 12 5 5 文本转换 text transform 12 5 6 水平对齐方式 text align 12 5 7 文本缩进 text indent 12 5 8 文本行高 line height 精品文档 14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载14欢迎下载 12 5 9 处理空白 white space 12 5 10 文本反排 unicode bidi direction 12 6 外边距与内边距属性 12 6 1 上边距 margin top 12 6 2 其他边距 margin bottom margin left margin right 12 6 3 外边距复合属性 margin 12 6 4 顶端内边距 padding top 12 6 5 其他内边距 padding bottom padding left padding right 12 6 6 内边距复合属性 padding 12 7 边框属性 12 7 1 边框样式 border stye 12 7 2 边框宽度 border width 12 7 3 边框颜色 border color 12 7 4 边框属性 border 12 8 定位属性 12 8 1 定位方式 position 12 8 2 元素定位 top right bottom left 12 8 3 层叠顺序 z index 12 8 4 浮动属性 float 12 8 5 清除属性 clear 12 8 6 可视区域 clip 12 8 7 层的宽度和高度 width height 12 8 8 超出范围 overflow 12 8 9 可见属性 visibility 12 9 列表属性 12 9 1 列表符号 list style type 12 9 2 图像符号 list style image 12 9 3 列表缩进 list style position 12 9 4 列表复合属性 list style 12 10 光标属性 cursor 12 11 滤镜属性 12 11 1 不透明度 alpha 12 11 2 动感模糊 blur 12 11 3 对颜色进行透明处理 chroma 12 11 4 阴影效果 dropShadow 12 11 5 对象翻转 flipH flipV 12 11 6 发光效果 glow 12 11 7 处理灰度 gray 12 11 8 反相 invert 12 11 9 X 光片效果 xray 12 11 10 遮罩效果 mask 12 11 11 波形滤镜 wave 12 12 练习题 精品文档 15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载15欢迎下载 第13讲 课时内容 Web 标准与 CSS 网页 布局实例 授课时间80 分钟课时2 2 教学内容 第 12 章讲述了 CSS 的基本语法 CSS 可以控制字体大小 设置字体样式 目前更多地 应用在网页布局上 本章将通过实例讲述 CSS 布局网页中的元素的方法 本章以 CSS 布局为重点 探讨 CSS 布局的入门知识和布局网页元素的实例技巧 教学重点 表单标记 插入表单对象 菜单和列表 文本域标记 id 标记 内容大纲 13 1 Web 标准与 CSS 布局 13 1 1 什么是 Web 标准 13 1 2 CSS 布局的优势 13 2 DIV CSS 布局网页基础 13 2 1 认识 DIV 13 2 2 一列固定宽度 13 2 3 一列自适应 13 2 4 两列固定宽度 13 2 5 两列宽度自适应 13 2 6 两列右列宽度自适应 13 3 使用 CSS 设计网站导航栏 13 3 1 实现背景变换的导航菜单 13 3 2 利用 CSS 制作横向导航 13 4 使用 CSS 设计表单样式 13 4 1 改变按钮的背景颜色和文字颜色 13 4 2 设置文本框的样式 13 4 3 设计文本框中的文字样式 13 5 字体及段落样式设计 13 5 1 利用 CSS 控制字体大小和行距 13 5 2 制作光晕文字效果 13 6 使用 CSS 设计图片样式 13 6 1 鼠标指针移上时图片渐变的效果 13 6 2 设计不重复出现的背景 13 7 使用 CSS 控制链接样式 13 7 1 使用 CSS 实现鼠标指针形状改变 13 7 2 鼠标指针移到链接文字上时改变文字大小或颜色 13 8 练习题 精品文档 16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载16欢迎下载 第14讲 课时内容 移动网页设计基础 CSS3 授课时间80 分钟课时2 2 教学内容 CSS3 是 CSS 规范的最新版本 在 CSS2 1 的基础上增加了很多强大的新功能 以帮助 开发人员解决一些问题 例如圆角功能 多背景 透明度 阴影等功能等 CSS2 1 是 单一的规范 而 CSS3 被划分成几个模块组 每个模块组都有自己的规范 这样的好 处是整个 CSS3 的规范发布不会因为部分难缠的部分而影响其他模块的推进 教学重点 边框 背景 文本 多列 转换 过渡 动画 用户界面 内容大纲 14 1 边框 14 1 1 圆角边框 border radius 14 1 2 边框图像 border image 14 1 3 边框阴影 box shadow 14 2 背景 14 2 1 背景图片尺寸 background size 14 2 2 背景图片定位区域 background origin 14 2 3 背景绘制区域 background clip 14 3 文本 14 3 1 文本阴影 text shadow 14 3 2 强制换行 word wrap 14 3 3 文本溢出 text overflow 14 3 4 文字描边 text stroke 14 3 5 文本填充颜色 text fill color 14 4 多列 14 4 1 创建多列 column count 14 4 2 列的宽度 column width 14 4 3 列的间隔 column gap 14 4 4 列的规则 column rule 14 5 转换 14 5 1 移动 translate 14 5 2 旋转 rotate 14 5 3 缩放 scale 14 5 4 扭曲 skew 14 5 5 矩阵 matrix 精品文档 17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载17欢迎下载 14 6 过渡 14 7 动画 14 7 1 规则声明动画 keyframes 14 7 2 animation 使用动画 14 8 用户界面 14 8 1 box sizing 14 8 2 resize 14 8 3 outline offset 14 9 实例应用 14 9 1 鼠标放上去显示全部内容 14 9 2 美观的图片排列 14 10 练习题 精品文档 18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载18欢迎下载 第15讲 课时内容 JavaScript 脚本基 础 授课时间80 分钟课时2 2 教学内容 JavaScript 语言是网页中广泛使用的一种脚本语言 使用 JavaScript 可以使网页产 生动态效果 JavaScript 以其小巧简单而备受用户的欢迎 本章将介绍 JavaScript 的基本概念 语言特点 基本语法 常见的事件和常见内部对象的使用 教学重点 了解 JavaScript 概念 了解 JavaScript 特点 掌握 JavaScript 基本语法 掌握 JavaScript 事件的使用 浏览器的内部对象 内容大纲 15 1 JavaScript 简介 15 2 JavaScript 基本语法 15 2 1 常量和变量 15 2 2 表达式和运算符 15 2 3 基本语句 15 2 4 函数 15 3 JavaScript 事件 15 3 1 onClick 事件 15 3 2 onchange 事件 15 3 3 onSelect 事件 15 3 4 onFocus 事件 15 3 5 onLoad 事件 15 3 6 onUnload 事件 15 3 7 onBlur 事件 15 3 8 onMouseOver 事件 15 3 9 onMouseOut 事件 15 3 10 onDblClick 事件 15 3 11 其他常用事件 15 4 浏览器的内部对象 15 4 1 navigator 对象 15 4 2 document 对象 15 4 3 windows 对象 15 4 4 location 对象 15 4 5 history 对象 15 5 练习题 精品文档 19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载19欢迎下载 第16讲 课时内容 利用 JavaScript 制 作网页特效 授课时间80 分钟课时2 2 教学内容 利用 JavaScript 可以轻松制作网页特效 如可以制作显示当前时间 跟随鼠标的文 字 本章就来介绍利用 JavaScript 制作时间特效 图像特效 窗口特效 鼠标特效 和其他一些常见特效的方法 教学重点 掌握时间特效的应用 掌握图像特效的应用 掌握窗口特效的应用 掌握鼠标特效的应用 掌握其他特效的应用 内容大纲 16 1 时间特效 16 1 1 显示当前时间 16 1 2 显示当前日期 16 1 3 显示网页停留时间 16 1 4 制作倒计时特效 16 2 图像特效 16 2 1 当鼠标指针经过图像时图像震动效果 16 2 2 图片闪烁效果 16 2 3 自动切换图像 16 3 窗口特效 16 3 1 全屏显示窗口 16 3 2 定时关闭窗口 16 4 鼠标特效 16 4 1 禁止鼠标右击 16 4 2 跟随鼠标指针移动的图像 16 4 2 跟随鼠标指针移动的图像 16 5 其他特效 16 5 1 设置为首页和加入收藏夹 16 5 2 浏览器状态栏显示信息 16 5 3 进入网站的口令设置 16 6 练习题 精品文档 20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载20欢迎下载 第17讲 课时内容移动网页设计基础 CSS3 授课 时间 80 分钟课时 2 2 教学内容 Dreamweaver 是一个可视化的网页设计和网站管理工具 它提供了强大的设计工具 在不用书写一行代码的情况下 就能够快速创建各种极具动态 HTML 特性的网页 Dreamweaver 是完全可定制的 用户可以通过书写 JavaScript 代码为 Dreamweaver 创 建新的行为和属性面板 以增强 Dreamweaver 本身的功能 教学重点 了解 Dreamweaver 的基本操作界面 掌握在网页中使用文本 插入图像 插入多媒体 掌握链接的设置 网页的布局 掌握表单的使用 使用 CSS 样式表 使用行为 内容大纲 17 1 Dreamweaver 的操作界面 17 2 在网页中使用文本 17 2 1 插入文本 17 2 2 设置文本属性 17 2 3 插入特殊字符 17 2 4 插入水平线 17 3 插入图像 17 3 1 在网页中插入图像 17 3 2 设置图像属性 17 3 3 使用图像编辑器 17 3 4 插入鼠标经过图像 17 4 插入多媒体 17 4 1 插入 Flash 17 4 2 打开浏览器窗口 17 4 3 插入 Java Applet 17 5 设置链接 17 5 1 创建文字链接 17