html教学课件（精选多篇）

发布时间：2020-07-30 08:37:12 来源：教学课件收藏本文下载本文手机版

推荐第1篇：Html语法

Html语法大全

访问过的可连接文字的颜色

语法格式： .leftmargin 页面左侧的留白距离

.topmargin 页面顶部的留白距离

语法格式：注：value为长度值为数字

align 属性

语法：文字

其属性有三种：left靠左,center居中,right靠右

〈p〉

为段落标记，可利用以上属性对整个段落进行设置

〈br>为换行标记

为不换行标记放在文字两边即可

例：

江南逢李龟年

歧王宅里寻常见催九堂前几度闻正是江南好风景落花时节又逢君

推荐第2篇：html基础

HTML的基本概念

（目的要求）

1.了解HTML的概述

2.掌握HTML的标记及属性 3.熟悉HTML的具体应用

（教学内容）

1.介绍本课程主要讲解内容，明确课程讲述目的

2.HTML概述和学习HTML的意义

3.HTML脚本(Script)编辑器

3.1 记事本

3.2 Dreamweaver 软件

3.3 其它编辑环境

4.HTML脚本的相关概念

4.1 标记

4.2 标记分类

4.3 标记属性

4.4 标记属性值

5.HTML脚本结构

6.标记介绍

6.1

6.2

6.3

6.4

推荐第3篇：HTML学习心得

HTML学习心得

一、HTML简介

全写： HyperText Mark-up Language，译名：超文件注标式语言（译名之一），简释：一种为普通文件中某些字句加上标示的语言，其目的在于运用标记（tag）使文件达到预期的显示效果。

HTML 是在 SGML 定义下的一个描述性语言，SGML(Standard Generalized Markup Language,标准通用标记语言)，是一种定义电子文档结构和描述其内容的国际标准语言，是所有电子文档标记语言的起源，早在Web发明之前SGML就已存在。HTML 不是程式语言，如 C++ 和 Java 之类，它只是标示语言，基本上你只要明白了各种标记的用法便算学懂了 HTML，它的格式非常简单，只是由文字及标记组合而成，在编辑方面，任何文字编辑器都可以，只要能将文件另存成 ASCII 纯文字格式即可，当然以专业的网页编辑软件为佳。

1.优点

HTML文档制作不是很复杂，且功能强大，支持不同数据格式的文件镶入，这也是WWW盛行的原因之一，其主要特点如下：1 简易性，HTML版本升级采用超集方式，从而更加灵活方便。2 可扩展性，HTML语言的广泛应用带来了加强功能，增加标识符等要求，HTML采取子类元素的方式，为系统扩展带来保证。3平台无关性。虽然PC机大行其道，但使用MAC等其他机器的大有人在，HTML可以使用在广泛的平台上，这也是WWW盛行的另一个原因。

二、HTML标记

任何标记皆由""围住，如标记名与小于号之间不能留有空白字符。某些标记要加上参数，某些则不必。如 Hello 参数只可加于起始标记中。在起始标记名前加上符号"/"便是其终结标记，如，标记字母大小写皆可。

1.标记种类

标记种类分为两种：围堵标记和空标记。围堵标记是以起始标记及终结标记将文字围住，令其达到预期显示效果。也就是说，标记是成对出现的，例如 Creation of Webpage ，其中便称为围堵标记。它以起始标记及终结标记标示文字 Creation of webpage ，令其显示成粗体，两者失其一都会发生错误显示。空标记是指标记单独出现，只有起始标记没有终结标记。例如，它的作用便是将标记后所有东西显示于下一行，可见终结标记于它是没意义的，但有些人会为空标记加上终结标记，这是为方便记认而己，对 HTML 没有影响。

2.标记类型

标记类型按用途可以分为：文件标记(如：、)、排版标记(如：、、)、字体标记(如：、)、清单标记(如：、)表格标记(如：、)、表单标记(如：)、图形标记(如：)、连结标记(如：、)、框架标记(如：、)、影像地图标记(如：、)、多媒体标记(如：、)、样式标记(如：、)和其它标记(如：、)。

三、HTML结构

基本HTML页面以DOCTYPE开始，它声明文档的类型，且它之前不能有任何内容（包括换行符和空格），否则将使文档声明无效，接着是标签，以结束。在它们之间，整个页面有两部分－－标题和正文。标题词－－夹在和标签之间－－这个词语在打开页面时出现在屏幕底部最小化的窗口。正文则夹在和

推荐第4篇：HTML 教案

HTML语言

一、基本元素

1.html元素：… 2.head元素：… 3.title元素：在浏览器标题栏和windows任务栏上显示… 4.body元素：…

推荐第5篇：html教案

《HTML基础》教案

教材：《dreamweaver cs3网页制作与实训》

执教：罗执清

一、教学目标：

1、了解HTML的概念、作用及特点

2、理解HTML文档结构

3、掌握标签的使用规范

4、了解常用标签的用法

二、教学重点：

1、HTML文件结构

2、标签使用规范

3、常用标签的使用

三、教学难点： HTML概念的理解

四、教学方法：

直观演示和任务驱动相结合

五、教学过程：

1、回顾站点管理相关操作

2、HTML概念及作用

3、HTML文件结构

：HTML文档开始。

：文档头部开始。

：文档标题开始。

HTML基础：文档标题。

：文档标题结束。

：文档头部结束。

：文档主体开始。

一个简单的网页：文档主体内容，它是网页的最主要部分。

推荐第6篇：html总结

第一章网页基本框架：

推荐第7篇：HTML实验报告

东北大学软件学院

《HTML与JavaScript》

实验报告

专业：软件工程

班

级：1405 学

号：20144706 姓

名：张俊怡

完成时间：2015/12/6

指导教师：王蓓蕾

总共页数： 8

网站主界面：（针对颜色不协调的问题已经改进）

主界面布局：

全程采用table布局，主要分块为上边一块，下边一块，中间过渡用动态效果展示网站信息。

下边左边是主要功能选择区，中间是文字动态区，右边是图片以及视频动态展示区。采用的CSS方法：

Cla外部关联和内部关联配合使用网站整体颜色风格：用淡雅浅色作为主页背景编写代码步骤：

最重要的是整体布局，布局好后分块修饰。

使用了JavaScript <script language=\"JavaScript\" type=\"text/javascript\">var d=new Date(); var

monthname=new Array(\"January\",\"February\",\"March\",\"April\",\"May\",\"June\",\"July\",\"August\",\"September\",\"October\",\"November\",\"December\"); var TODAY = monthname[d.getMonth()] + \"\" + d.getDate() + \", \" + d.getFullYear(); </script> 来获取当前系统时间。

网站介绍页面：

使用了较多是js和jQuery 实现了图片的动态特效。资料下载页面：

布局方式：

采用table布局，布局较为简单，资料下载这个页面能实现的功能其实包括资料下载和上传。代码：

留言页面：

用JavaScript实现的逻辑判断

用table进行布局，form，input标签。 CSS采用的是内部关联使用。

文章欣赏界面：

访客可以再次阅读所发布的文章

登陆界面，采用div布局，用内部CSS关联装饰

用JavaScript进行密码验证（当然这没用，应该用后台逻辑验证）文章展示区使用的table布局 Herf了几个文章的连接

注册粉丝界面：

简单的一个表单form，和JavaScript判断

采用table布局，难点在JavaScript判断，得一个一个判断，符合格式才能输入下一个信息。

在线聊天界面：

视频欣赏界面：

查看留言界面：

实验报告总结：网站全部界面已完成还有少部分界面未写，部分功能设计后台数据库的未实现，其他属于HTML，HTML5和JavaScript知识的功能均已实现（数据库等后台交互功能有困难），这个网站虽然不是商业性盈利模式的，但的确是我心里想要展示的，文章欣赏那一块功能是整个网站灵感的起源，因为展示的是我自己写的文章。

推荐第8篇：Html标记

Html简介

全写： HyperText Mark-up Language 译名：超文件注标式语言（译名之一）

简释：一种为普通文件中某些字句加上标示的语言，其目的在于运用标记（tag）使文件达到预期的显示效果。

HTML 是在 SGML 定义下的一个描述性语言，或可说 HTML 是 SGML 的一个应用程式，HTML 不是程式语言，如 C++ 和 Java 之类，它只是标示语言，基本上你只要明白了各种标记的用法便算学懂了 HTML，HTML 的格式非常简单，只是由文字及标记组合而成，于编辑方面，任何文字编辑器都可以，只要能将文件另存成 ASCII 纯文字格式即可，当然以专业的网页编辑软件为佳。

■ 阅读须知：

这一篇【HTML剖析】偏重于标记的介绍，考虑到易懂及每节的篇幅问题，我并不按 W3C 的 HTML 分类，这可令你更易选择有兴趣的标记，其中只有【文件标记】是必读的，其余可任意选择。这一篇不会提及任何网页编辑软件，只要掌握了 HTML ，任何网页编辑工具都可以变成一把利器。 ■ 标记写法：

任何标记皆由\"\"所围住，如标记名与小于号之间不能留有空白字符。

某些标记要加上参数，某些则不必。如 Hello 参数只可加于起始标记中。

在起始标记之标记名前加上符号\"/\"便是其终结标记，如标记字母大小写皆可。

■ 围堵标记与空标记：

标记按型态分为围堵标记与空标记围堵标记

顾名思义，它以起始标记及终结标记将文字围住，令其达到预期显示效果。例如 HTML Source ： Creation of Webpage is my favourite.显示成： Creation of Webpage is my favourite.

其中便称为围堵标记。

它以起始标记及终结标记标示文字 Creation of webpage ，令它显示成粗体，两者失其一都会发生错误显示。

空标记

是指标记单独出现，只有起始标记没有终结标记。例如 HTML Source：

I love Creation of Webpage.It\'s a wonderful place.显示成： I love Creation of Webpage.It\'s a wonderful place.

其中换行标记便属空标记。

它的作用便是将标记后所有东西显示于下一行，可见终结标记于它是没意义的，但有些人会为空标记加上终结标记，这是为方便记认而己，对 HTML 没有影响

HTML 标记一览

标记类型译名或意义用文件标记

● 文件声明 ● 开头 ● 标题 ● 本文排版标记

○ 说明标记 ○ 段落标记 ○ 换行标记 ○ 水平线 ● 居中 ● 预设格式示

● 区隔标记 ● 不折行 ● 建议折行字体标记

● 加重语气 ● 粗体标记 ● 强调标记 ● 斜体标记 ● 打字字体 Courier ● 加上底线 ● 一级标题标记 ● 二级标题标记 ● 三级标题标记 ● 四级标题标记 ● 五级标题标记 ● 六级标题标记 ● 字形标记 ○ 基准字形标记 ● 字体加大作备注让浏览器知道这是 HTML 文件提供文件整体资讯

定义文件标题，将显示于浏览顶端设计文件格式及内文所在为文件加上说明，但不被显示

为字、画、表格等之间留一空白行令字、画、表格等显示于下一行插入一条水平线

令字、画、表格等显示于中间反对令文件按照原始码的排列方式显设定字、画、表格等的摆放位置令文字不因太长而绕行预设折行部位产生字体加粗 Bold 的效果产生字体加粗的效果字体出现斜体效果字体出现斜体效果

字体，字母宽度相同加上底线反对

变粗变大加宽，程度与级数反比将字体变粗变大加宽将字体变粗变大加宽将字体变粗变大加宽

将字体变粗变大加宽将字体变粗变大加宽设定字形、大小、颜色反对设定所有字形、大小、颜色反对令字体稍为加大

● 字体缩细令字体稍为缩细 ● 画线删除为字体加一删除线反对 ● 程式码字体稍为加宽如 ● 键盘字字体稍为加宽，单一空白 ● 范例字体稍为加宽如 ● 变数斜体效果 ● 传记引述斜体效果 ● 引述文字区块缩排字体

● 述语定义斜体效果 ● ● ● 清单标记

● ● ○ ● 对

● 反对

● ○ ○ 表格标记

● ● ● ● ● 会变粗表单标记

● 式

● 字

○ ● 单

○ 图形标记

○ 性

连结标记

●地址标记下标字下标字顺序清单无序清单清单项目选单清单目录清单定义清单定义条目定义内容表格标记表格标题表格列表格栏表格标头表单标记文字区块输入标记选择标记选项图形标记连结标记斜体效果指数下标字清单项目将以数字、字母顺序排列清单项目将以圆点排列每一标记标示一项清单项目清单项目将以圆点排列，如反清单项目将以圆点排列，如清单分两层出现标示该项定义的标题标示定义内容设定该表格的各项参数做成一打通列以填入表格标题设定该表格的列设定该表格的栏相等于，但其内之字体决定单一表单的运作模提供文字方盒以输入较大量文决定输入形式

建立 pop-up 卷动清每一标记标示一个选项用以插入图形及设定图形属加入连结

○ 基准标记可将相对 URL 转绝对及指定连结目标框架标记

● 框架设定设定框架

○ 框窗设定设定框窗

○ 页内框架于网页中间插入框架 IE ● 不支援框架设定当浏览器不支援框架时的提示影像地图

● 影像地图名称设定影像地图名称 ○ 连结区域设定各连结区域多媒体

○ 背景声音于背景播放声音或音乐 IE ○ 多媒体加入声音、音乐或影像

其他标记

● 走动文字令文字左右走动 IE ● 闪烁文字闪烁文字 NC ○ 页内寻找器可输入关键字寻找于该一页反对

○ 开头定义让浏览器知道这是 HTML 文件

○ 关系定义定义该文件与其他 URL 的关系 StyleSheet ● 样式表控制网页版面 ● 自订标记独立使用或与样式表同用

注：

● 表示该标记属围堵标记，即需要关闭标记如。 ○ 表示该标记属空标记，即不需要关闭标记。 IE 表示该标记只适用于 Internet Explorer。 NC 表示该标记只适用于 Netscape Communicator。

反对表示该标记不为 W3C 所赞同，通常这标记是 IE 或 NC 自订，且己为众所支持，只是 HTML 标准中有其它同功能或更好的选择。

弃用表示该标记己为 W3C 所弃用，是过时的标记，但 HTML 具向下兼容的特性，不用担心新浏览器不支援旧标记。

新表示该标记是 HTML 4.0 中新增的

文件标记

；；； ■ HTML 基本架构：以下 HTML Source Code 便是一份 HTML 文件的基本架构：网页的标题网页的内容，很多标记都作用于此

推荐第9篇：HTML教案第四章

第9次课 CSS基础课时：4课时

一、教学目标

1.2.3.4.会创建无下划线的超链接样式会创建统一外观的字体文本会创建个性化的表单会创建个性化的表格

二、教学重点

1.样式的基本语法

2.会创建常见的样式：统一的文字、颜色等外观、无下划线的超链接、细边框输入框

三、教学难点

内嵌样式、行内样式、样式表文件的使用场合

四、教学过程

【回顾】[10分钟] 回顾之前所学基本标签，引导学生在网页美化以及格式修改中遇到的问难。从而引入样式表。

前几次课所学的标签，在网页中呈现出的效果，比较简单，样式比较单一。 CSS主要用于改变网页中标签的样式，使网页变得更华丽。可以从外观上更能吸引读者。CSS相当于华丽的衣服样式表能实现内容与样式的分离，方便团队开发。

1.样式表的基本语法[10分钟]

1) 样式表的基本结构。 2) 样式规则并举例说明。 3) 引入类样式。

 课堂案例：样式表的基本语法

2.文本属性[10分钟] 引入：

首先从文本的大小，颜色，字体等来描述文本属性。强调用样式来实现文本的大小颜色字体的显示的好处

- 2

5.方框属性[15分钟]

 引入：

首先从文本的大小，颜色，字体等来描述文本属性。  讲解要点：

1) 盒子模式：以网页中放入的一副图片，说明盒子模式设计的各种边界、填充、边框的含义。

2) 应用边框属性、填充属性，制作常见的表格多列中分界线样式。 3) 应用边框属性，制作细边框输入框样式。

 课堂案例：

6.特殊样式[5分钟]

 讲解要点：

无下划线的超俩链接的制作方法。  课堂案例：

7.课堂练习2[10分钟]

编写如下图所示效果对应的HTML代码

一、作业布置

参考答案：外部样式表练习

拍拍用户登陆 5

QQ号码忘记QQ号码>> QQ密码忘记密码>>

推荐第10篇：html标签(DOC)

Html的标记：

1、单标记：

2、双标记：内容（开始标记和结束标记）

内容

3、标记属性：文件头部：双标记文件主体：双标记页面标题标记：双标记结构性标记：标题文字

标题标记：双标记

标题的对齐：标题内容层

层标记：双标记

层对齐:可以是图片文字

第11篇：html标签属性

由惊风转载自互联网。跟大家分享，不需要积分！跑马灯

...普通卷动

...滑动

...预设卷动

...来回卷动

...向下卷动

...向上卷动

向右卷动

向左卷动

...卷动次数

...设定宽度

...设定高度

...设定背景颜色

...设定滚动速度

...设定卷动时间

...鼠标经过上面时停止滚动

...鼠标离开时开始滚动

字体效果

...标题字(最大) ...标题字(最小) ...粗体字

...粗体字(强调) （同上效果略同）

...斜体字

...斜体字(强调)

...斜体字(表示定义) ...底线

...底线(表示插入文字) ...横线

...删除线

...删除线(表示删除) ...键盘文字

...打字体

...固定宽度字体(在文件中空白、换行、定位功能有效)

...</plaintext>固定宽度字体(不执行标记符号) ...固定宽度小字体...字体颜色...最小字体 ...无限增大区断标记水平线 水平线(设定大小) 水平线(设定宽度) 水平线(设定颜色) (换行) ...水域(不换行) ...水域(段落) ...置中连结格式 (预设好连结路径) 外部连结 外部连结(另开新视窗) 外部连结(全视窗连结) 外部连结(在指定页框连结) 贴图/音乐 <img src=图片位址>贴图 <img src=图片位址 width=’180’>设定图片宽度<img src=图片位址 height=’30’>设定图片高度 <img src=图片位址 alt=’提示文字’>设定图片提示文字<img src=图片位址’ border=’1’>设定图片边框背景音乐设定表格语法 ...表格位置,置左...表格位置,置中 ...背景图片的URL=就是路径网址...设定表格边框大小(使用数字) ...设定表格的背景颜色...设定表格边框的颜色 ...设定表格暗边框的颜色...设定表格亮边框的颜色 ...指定内容与格线之间的间距(使用数字) ...指定格线与格线之间的距离(使用数字) ...指定表格的栏数 ...设定表格外框线的显示方式...指定表格的宽度大小(使用数字) ...指定表格的高度大小(使用数字) ...指定储存格合并栏的栏数(使用数字) ...指定储存格合并列的列数(使用数字) 分割视窗 左右分割,将左边框架分割大小为20%右边框架的大小浏览器会自动调整 上下分割,将上面框架分割大小为20%下面框架的大小浏览器会自动调整 分割左右两个框架 分割左中右三个框架分割上中下三个框架属性： cols 垂直切割窗口（如左右分割两个窗口）接受整数值，百分数，*（*代表占用余下空间）数值的个数代表分成的部分数目，要以逗号分隔。例：cols=\"30,*,50%\"可以切成三个视窗，第一部分是30像素（pixels）为绝对分割，第二部分是当分配完第一和第三视图后剩下的空间，第三部分则占整个窗口的50%宽度，为相对分割。rows 就是横向切割，将窗口上下分开，数值设置同上。 以上两属性尽量不要在同一个标记中，因为王井（netscape）不支持，尽量采用多重分割。 frameborder 设置框架的边框，其值有0不要边框，1要边框。border 设置框架边框厚度 framespacing 表示框架与框架间保留空白的距离frame 元素（单标签）语法格式： 属性： name 框架名称，指定框架来做连接的目标窗口。 src 框架中要显示的网页文当url地址，每个个框架要对应一个html文挡。scrolling 是否显示滚动条，yes/no,auto是自动。noresize 设置不让使用者改变这个框架的大小，noframe元素 指定当使用了框架的页面在不支持框架的浏览器中打开时显示的信息语法格式： ......表单语法格式： .... method有两种提交方式get,post action 是指明处理该表单的程序位置，这样表单所填的资料才能传给cgi做处里，可设定此参数为action=\"mailto:lwr8494@163.com\" 这样此表单所填的资料将会发送到这个邮箱地址。method 是指传送信息给cgi等网络程序的方式。可选post方法， get方法，post方法容许传送大量信息。get方法只接受低于1k的信息。申请表单用的是post搜索引擎用的是get 注解 指定超连结的分割视窗指定锚名称的超连结指定超连结 被连结点的名称 ....用来显示电子邮箱地址粗体字指定超连结的分割视窗更改预设字形大小加入背景音乐显示大字体闪烁的文字设定文字颜色显示本文换行 设定表格标题位置 ...为表格加上标题向中对齐 ...用於引经据典的文字...用於列出一段程式码...加上注解设定定义列表的项目解说...显示\"定义\"文字...列表文字标签 ...设定定义列表的标签设定定义列表的项目强调之用 任意指定所用的字形设定字体大小 设定户动式表单的处理方式 设定户动式表单之资料传送方式设定视窗的上下边界设定视窗的左右边界为分割视窗命名 锁住分割视窗的大小设定分割视窗的卷轴将HTML档加入视窗 将视窗分割成左右的子视窗将视窗分割成上下的子视窗...划分分割视窗~ 设定文字大小标示文件资讯加上分格线 文件的开始与结束斜体字 调整图形影像的位置为你的图形影像加注加入影片 插入图片并预设图形大小插入图片并预设图形的左右边界预载图片功能 设定图片边界插入图片 插入图片并预设图形的上下边界在表单中加入输入栏位定义查询用表单 ...表示使用者输入文字 ...列表的项目 ( 可指定符号 ) 跑马灯效果 ...条列文字标签 自动更新文件内容可同时选择多项的列表栏定义不出现分割视窗的文字...有序号的列表 定义表单中列表栏的项目设定对齐方向分段 ...显示人名使用原有排列 ...用於引用字 ...在表单中定义列表栏显示小字体文字加横线用於加强语气下标字上标字 调整表格的宽线高度调整资料栏位之边界调整表格线的宽度调整表格的高度调整表格的宽度...产生表格的标签调整表格栏位之左右对齐设定表格栏位之背景颜色表格栏位的合并设定表格栏位不换行调整表格栏位之上下对齐调整表格栏位宽度...定义表格的资料栏位 表单中加入多少列的文字输入栏决定文字输入栏是自动否换行...定义表格的标头栏位文件标题 ...定义表格美一行打字机字体文字加底线 ...无序号的列表 ( 可指定符号 ) ...用於显示变数BlockQuotc文本缩进表示颜色的有三种方式；1，16进制颜色代码语法：#RRGGBB 例：红色 2，10进制RGB码 语法：RGB（RRR，GGG，BBB） 例：红色 3,直接用颜色的英文名称 例：红色 .....<h2><a href="/html/da0a07ff043cecb4.html" target="_blank">第12篇：HTML学习日志</a></h2>HTML学习日志01.HTML简介HTML(Hyper Text Mark-up Language超文本标记语言)，标记就是用来描述网页内容的一些特定符号，HTML不是编程语言，而是一种描述性的标记语言，用于描述网页中内容的显示方式，比如文字以什么颜色、大小来显示，这些都是利用HTML标记来实现的.HTML文档的创建方式: 用HTML语言创建的文档 ·手工直接编写(例如记事本) ·通过图形化的HTML开发软件Dreamweaver ·由Web服务器上的动态网页程序生成标记也称为标签或元素.02.HTML语法HTML最基本的语法是: 内容标记符通常都是成对出现的，有一个开头标记和结束标记，结束标记只是在开头标记的前面加一个斜杠\"/\"，当浏览器打开html文件后，就会理解里面的标记符，然后把标记符对应的功能表达出来。例如: 文字内容制作一个html网页文件: ·新建一个记事本的文件，命名为 *.html ·在文件里面输入内容 HTML标记的类型: 单标记与双标记 ·单标记: ·单一型，无属性值: 如: ·单一型，有属性值: 如: ·双标记·无属性值: ...如: ...·有属性值: ...如: ...说明: ·标记与属性、属性之间以空格分隔·属性不区分先后顺序，且属性不是必需的.·虽然在HTML中标记不区分大小写，但在XHTML中所有标记都必须小写，所以建议所有标记都采用小写.03.HTML文档结构所有的网页文件，通常由四对标记来构成文档的骨架: 标题正文<h2><a href="/html/aca9b2bb78854604.html" target="_blank">第13篇：Html特效技巧</a></h2>Html特效技巧贴图：<img src=\"图片地址\">加入连接：写上你想写的字 在新窗口打开连接：写上要写的字 消除连接的下划线在新窗口打开连接： style=\"text-decoration:none\" target=\"_blank\">写上你想写的字 移动字体(走马灯)：写上你想写的字 贴音乐： Embed：嵌入帖子背景音乐： 贴flash: 贴影视文件：<img dynsrc=\"文件地址\" width=\"宽度\" height=\"高度\" start=mouseover>消除连接的下划线：写上你想写的字 取消选取、防止复制onpaste=\"return false\" 不准粘贴 oncopy=\"return false;\" oncut=\"return false;\" 防止复制 IE地址栏前换成自己的图标防止被人frame <script LANGUAGE=JAVASCRIPT>if (top.location != self.location)top.location=self.location; // --></script> 段落：段落换背景： 固定帖子背景不随滚动条滚动：加入背景音乐 IE: NS:*.mid你的背景音乐的midi格式文件<h2><a href="/html/52e5e7a10508fcfe.html" target="_blank">第14篇：HTML实习报告</a></h2>《HTML标记语言》实习报告一、实习目的：运用CSS样式表，通过设置其一些属性和对表格的布局以及图形的插入，实现对网页的设置。理解CSS样式表的作用，掌握建立CSS样式表的方法并熟练地对其进行运用。理解Dreamweaver的基本使用方法和它与CSS的关系，并能熟练地用Dreamweaver制作网页。二、实习任务：1．熟练地运用Dreamweaver软件 2．进一步了解CSS样式表应用 3．运用所学知识练习图文混排4．熟练地进行图文混排操作： 12月26日，阳光家园12月27日，首字下沉；百度搜索；12月28日，图文混排，八仙过海；教育在线 12月29日，游戏茶苑 12月30日，期末测试三、实习内容：12月26日：阳光家园：用Dreamweaver软件对网页进行编辑，利用表格布局，插入图片；新建另一个空白页，利用表格布局，插入图片、文字等元素，保存；对第一个网页的图片“联体别墅”- 1《HTML标记语言》实习报告12月28日：① 图文混排；八仙过海：设置背景、字体、字号、文字图片下沉方式、行间距、文本修饰；并对第二个网页中的标题设置文本对齐方式； ② 教育在线：- 3《HTML标记语言》实习报告12月30日：利用表格布局，插入图片、输入文字，进行图文混排练习，制作完整网页；四、实习中的问题和解决办法：问题1：表格的布局不好掌握，导致网页混乱解决办法：制作前看清网页布局的结构，要细心问题2:设置行之间的距离line-hight时不是过大就是过小解决办法：可以设置padding-top（left/right/bottom）的大小来调整问题3：在表格的一行中插入多个flash按钮时呈两行显示解决办法：将需插入按钮的表格一行拆分成与flash按钮个数相同的几列，在一格中只插入一个按钮问题4：制作的网页是整个窗口的左侧，而不是居中解决办法：将用于布局的所有表格的对齐方式改为居中对齐，这个办法不论在哪台计算机上网页始终是居于窗口的中部问题5：用enter换行时上下两行之间有一行空白解决办法：用shift+enter换行五、实习体会：这次实训，让我学到很多。平时的一些问题都暴露出来了，能及时得到解决。知识有没有掌握与细心程度有关，只有细心才能有效避免一些错误；比如用表格布局网页结构，网页的布局是许多个表格构成的，我们不仅要知道要用表格来布局，同时也要知道在一个网页里，哪里要用表格布局，要用什么样的表格布局，是多少行多少列。要讲所- 5<h2><a href="/html/bd934505a75a48c5.html" target="_blank">第15篇：HTML教案第三章</a></h2>课程名称：使用HTML语言开发商业站点教案《HTML》理论课教案第3章表单和框架一、整章授课思路 [100分钟] .................................................................................................................2 1.2.2.1 2.2 2.3 3.3.1 3.2 4.5.5.1 5.2 5.3 5.4 5.5 6.回顾、预习检查、任务、目标部分 [10分钟] .....................................................3 [表单页面的基本结枸[10分钟] .............................................................................3 为什么需要表单？ .......................................................................3 表单包含的控件： .......................................................................3 表单页面的基本结构。 ...............................................................3 各种表单控件的逐一介绍[20分钟] .......................................................................4 表单元素的统一格式。 ...............................................................4 各种表单元素逐一介绍，先讲解语法，然后举例 ...................4 课堂练习[15分钟] ...................................................................................................5 框架[25分钟] ...........................................................................................................6 框架窗口的组成 ...........................................................................6 框架的使用场合。 .......................................................................6 框架的基本结构。 .......................................................................6 如何创建多个复杂的窗口。 .......................................................6 如何设置窗口链接的显示位置。 ...............................................6 课堂练习2[15分钟] ................................................................................................7 编写如下图所示效果对应的html代码 ..............................................................................7 7.总结[5分钟] .............................................................................................................7二、学员问题汇总 .....................................................................................................................................7三、作业布置 .............................................................................................................................................7-3 单行文本输入框(TEXT) 密码框(PASSWORD) 单选按钮(RADIO) 复选框(CHECKBOX) 下拉列表框(SELECT) 按钮：重置按钮(RESET)、提交按钮(SUBMIT)、普通按钮(BUTTON) 多行文本框(TEXTAREA) 课程名称：使用HTML语言开发商业站点教案送到脚本，而不使用请求字符串。语法：method=(get|post)  课堂案例：表单的基本结构  补充案例：详细介绍post和get提交方式的区别。get传送的数据量较小，不能大于2KB。post传送的数据量较大。 POST一般用于提交的信息比较大的情况，它比GET要安全，因为由它提交的信息不会显示在浏览器地址栏上，而GET则用于提交信息比较小的情况，它的速度比POST要快，但是安全性低，因原因是提交的信息会在浏览器地址栏中显示出来，例如提交密码就不能用GET，必须用POST。当我们提交的信息较少且对安全要求不高的时候就可以使用GET，比如百度搜索（演示）。3.各种表单控件的逐一介绍[20分钟]3.1 表单元素的统一格式。常用属性有： type：指定表单元素的类型。可用的选项有TEXT、PASSWORD、CHECKBOX、RADIO、SUBMIT、RESET、FILE、HIDDEN和BUTTON。默认值为TEXT。 NAME：指定表单元素的名称。例如，如果表单上有几个文本框，可以按照名称来标识它们教案5 课程名称：使用HTML语言开发商业站点教案5.框架[25分钟]5.1 框架窗口的组成      框架集页面(FrameSet.htm) 广告栏顶部框架(top.htm) 框架的边框导航栏左侧框架(left.htm) 详细内容页面右侧框架(main.htm) 5.2 框架的使用场合。 在页面的一个固定部分显示Logo或静态信息 左侧框架显示目录，右侧框架显示内容，用户只需单击左侧窗口的目录，在右侧窗口中就会显示相应内容，如网上在线学习教程、论坛、后台管理、产品介绍等。 框架能有机地把多个页面组合在一起，这多个页面之间可互相独立，却又可相互联系。5.3 框架的基本结构。 （框架） （框架集）页面的结构是通过属性rows和cols来设置的，根据框架的分割方式可分为：上下分割窗口、左右分割窗口、嵌套分割窗口。 演示将放在中是否可以显示，引出：HTML 文档可包含 FRAMESET元素或BODY元素之一，而不能同时包含两者。但是可以在标签对中使用<h2><a href="/html/cd088f91cfb2ba44.html" target="_blank">第16篇：HTML教案第四章</a></h2>课程名称：使用HTML语言开发商业站点教案《 HTML 》理论课教案第4章 CSS样式表一、整章授课思路 [100分钟] .................................................................................................................2 1.2.2.1 2.2 2.3 3.回顾、预习检查、任务、目标部分 [10分钟] .....................................................2 [表单页面的基本结枸[10分钟] .............................................................................2 为什么需要表单？ .......................................................................2 表单包含的控件： .....................................错误！未定义书签。表单页面的基本结构。 .............................错误！未定义书签。各种表单控件的逐一介绍[20分钟] .......................................................................3 3.1 表单元素的统一格式。 .............................错误！未定义书签。 3.2 各种表单元素逐一介绍，先讲解语法，然后举例错误！未定义书签。 4.5.5.1 5.2 5.3 5.4 5.5 6.7.课堂练习[15分钟] ...................................................................................................3 框架[25分钟] ..........................................................................错误！未定义书签。框架窗口的组成 ...........................................................................3 框架的使用场合。 .....................................错误！未定义书签。框架的基本结构。 .....................................错误！未定义书签。如何创建多个复杂的窗口。 .....................错误！未定义书签。如何设置窗口链接的显示位置。 .............错误！未定义书签。课堂练习2[15分钟] ................................................................................................5 总结[5分钟] .............................................................................................................6二、学员问题汇总 ...................................................................................................错误！未定义书签。三、作业布置 .............................................................................................................................................7- 2 课程名称：使用HTML语言开发商业站点教案CSS主要用于改变网页中标签的样式，使网页变得更华丽。可以从外观上更能吸引读者。CSS相当于华丽的衣服样式表能实现内容与样式的分离，方便团队开发。 4.样式表的基本语法[10分钟]1) 样式表的基本结构。 2) 样式规则并举例说明。 3) 引入类样式。 课堂案例：样式表的基本语法5.文本属性[5分钟] 引入：首先从文本的大小，颜色，字体等来描述文本属性。强调用样式来实现文本的大小颜色字体的显示的好处 课堂案例： 6.课堂练习[10分钟]做“申请表”的表单练习，参考“课堂联系案例\课堂练习1”。7.背景属性[5分钟] 引入：首先从文本的大小，颜色，字体等来描述文本属性。  讲解要点：backcolor , background-image ,background-repeat 3个属性的基本用法。 注意：- 4 课程名称：使用HTML语言开发商业站点教案9.特殊样式[5分钟] 讲解要点：无下划线的超俩链接的制作方法。  课堂案例：10.课堂练习2[10分钟]编写如下图所示效果对应的HTML代码11.制作图片按钮[10分钟]  讲解要点：图片按钮的制作方法。  课堂案例：- 6 课程名称：使用HTML语言开发商业站点教案二、作业布置参考答案：外部样式表练习 拍拍用户登陆 QQ号码忘记QQ号码>>7 课程名称：使用HTML语言开发商业站点教案 QQ密码忘记密码>> <h2><a href="/html/34d48edcc4814ec0.html" target="_blank">第17篇：HTML教案第五章</a></h2>课程名称：使用HTML语言开发商业站点教案《HTML》理论课教案第5章使用Dreamweaver制作网页一、整章授课思路 [100分钟] .................................................................................................................2 1.2.3.4.5.6.7.8.9.10.回顾、预习检查、任务、目标部分 [10分钟] .......................................................2 基本标签的使用[10分钟] ........................................................................................2 表格的使用，创建表格布局页面[10分钟].............................................................3 课堂练习1[10分钟] ................................................................................................3 表单的使用，结合表格布局进行使用 [10分钟] ...................................................4 课堂练习2 [10分钟] ................................................................................................4 制作框架网页[10分钟] ............................................................................................4 制作样式表 [15分钟] ..............................................................................................5 课堂练习3 [10分钟] ................................................................................................5 总结[5分钟] .............................................................................................................5二、学员问题汇总 .....................................................................................................................................5三、作业布置 .............................................................................................................................................6-2 课程名称：使用HTML语言开发商业站点教案结合如何制作一个图文并茂的页面示例，仿效演示并穿插讲解：1) 2) 3) 4) 5) 6) 如何设置页面背景、标题。如何插入图片。如何插入段落、换行。如何设置超链接。如何格式化文本：文字颜色、字号等如何插入项目列表3.表格的使用，创建表格布局页面[10分钟]讲解重点：结合如何制作一个新产品展示表格页面，依次演示并穿插讲解：1.创建跨行或跨列的表格。2.设置表格背景3.设置单元格背景色，对齐方式。4.课堂练习1[10分钟]练习使用表格布局多张图片，关键是设置表格的边框、填充、边界均为0。-教案课程名称：使用HTML语言开发商业站点教案1） 2）如何制作框架窗口。如何设置超链接打开目标窗口。8.制作样式表 [15分钟] 结合如何美化表格页面、制作图片按钮、依次演示并穿插讲解：（1）如何使用Dreamweaver制作各类样式。（2）如何应用样式如何使用Dreamweaver制作样式，参考文件夹“补充案例\使用Dreamweaver制作样式实例.htm” 9.课堂练习3 [10分钟] 练习上述讲解的各种样式10.总结[5分钟] 7) 8) 9) 10) 创建表格最少需要那三个标签？简述表格的基本结构。跨行跨列的表格，主要在什么情况下使用？给你一个表格，你会从哪些方面进行美化？ 二、学员问题汇总 问题1：答：。。。。。。  问题2：- - 6 课程名称：使用HTML语言开发商业站点 <h2><a href="/html/3602a301962a1185.html" target="_blank">第18篇：HTML个人总结</a></h2>HTML 网站开发的主要原则是：– 用标签元素HTML描述网页的内容结构； – 用CSS描述网页的排版布局；– 用JavaScript描述网页的事件处理，即鼠标或键盘在网页元素上的动作后的程序 HTML（Hyper Text Mark-up Language 超文本标记语言）的缩写，是最基础的网页语言。 Html是通过标签来定义的语言，代码都是由标签所组成。Html代码不用区分大小写。 Html代码由开始结束。里面由头部分和体部分<h2><a href="/html/12ab9f85de7830e1.html" target="_blank">第19篇：html标签总结</a></h2>:标记中的内容是用html语言:网页头部信息:网页标题<h2><a href="/html/c1c2099853312d59.html" target="_blank">第20篇：HTML abbr 标签</a></h2>HTML 标签HTML 标签的定义和用法标签最初是在 HTML 4.0 中引入的，表示它所包含的文本是一个更长的单词或短语的缩写形式。表示一个缩写形式，比如 \"Inc.\"、\"etc.\"。通过对缩写词语进行标记，您就能够为浏览器、拼写检查程序、翻译系统以及搜索引擎分度器提供有用的信息。 etc.HTML 标签浏览器支持IE 6 或更早版本的 IE 浏览器不支持标签。HTML 标签标准属性id, cla, title, style, dir, lang, xml:langHTML 标签事件属性onclick, ondblclick, onmousedown, onmouseup, onmouseover,onmousemove, onmouseout, onkeypre, onkeydown, onkeyup本文地址：专注于网站建设<a href="#" tpid="12" target="_self" class="download_card download_card_box jhcdown"> <img class="download_card_pic" src="/templates/pc/static/images/icon_word.2.png" alt="html教学课件"> <div class="download_card_msg"> <div class="download_card_title" style="text-decoration:none;">《html教学课件.doc》</div> <div class="download_card_tip">将本文的Word文档下载到电脑，方便编辑。</div> <div class="download_card_tj"> 推荐度： <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAY1BMVEUAAAD/mAD/mgD/mQD/mQD/mQD/mQD/mAD/mQD/mQD/mQD//wD/mQD/mAD/nwD/mQD/mAD/mQD/mQD/mgD/mAD/mQD/mAD/mAD/mQD/mgD/mQD/mgD/lwD/mQD/lQD/mwD/mQAl+fFuAAAAIHRSTlMA7ytS5M++uGk2JAGqjAzr1ZKFR/agl005MMxiYF8YF49KoKIAAAC9SURBVDjLlZJZCsMwDETl2vEWZ9+76v6nrAkhYCUR7fsyzGNgsOBP8mHIWUEiSragRqxzvoBW0IJIxhdEpkshQ2QrJtzomIKritK9WoM7pni6EjZm22iFJyjdWAcgkUWCF1wuPMAimPwGkZvgcmrQnDOqmFOD5pxReUiwVLCQUlChIIKhgiGCooIiv4kHykSYj4I7HdG3bb89H4nQ4Mr4AXiPZzM0RoKHFR/WGXSEXmDHaToj3Mkld1mA3/gCrXs1vl7stYYAAAAASUVORK5CYII="> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAY1BMVEUAAAD/mAD/mgD/mQD/mQD/mQD/mQD/mAD/mQD/mQD/mQD//wD/mQD/mAD/nwD/mQD/mAD/mQD/mQD/mgD/mAD/mQD/mAD/mAD/mQD/mgD/mQD/mgD/lwD/mQD/lQD/mwD/mQAl+fFuAAAAIHRSTlMA7ytS5M++uGk2JAGqjAzr1ZKFR/agl005MMxiYF8YF49KoKIAAAC9SURBVDjLlZJZCsMwDETl2vEWZ9+76v6nrAkhYCUR7fsyzGNgsOBP8mHIWUEiSragRqxzvoBW0IJIxhdEpkshQ2QrJtzomIKritK9WoM7pni6EjZm22iFJyjdWAcgkUWCF1wuPMAimPwGkZvgcmrQnDOqmFOD5pxReUiwVLCQUlChIIKhgiGCooIiv4kHykSYj4I7HdG3bb89H4nQ4Mr4AXiPZzM0RoKHFR/WGXSEXmDHaToj3Mkld1mA3/gCrXs1vl7stYYAAAAASUVORK5CYII="> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAY1BMVEUAAAD/mAD/mgD/mQD/mQD/mQD/mQD/mAD/mQD/mQD/mQD//wD/mQD/mAD/nwD/mQD/mAD/mQD/mQD/mgD/mAD/mQD/mAD/mAD/mQD/mgD/mQD/mgD/lwD/mQD/lQD/mwD/mQAl+fFuAAAAIHRSTlMA7ytS5M++uGk2JAGqjAzr1ZKFR/agl005MMxiYF8YF49KoKIAAAC9SURBVDjLlZJZCsMwDETl2vEWZ9+76v6nrAkhYCUR7fsyzGNgsOBP8mHIWUEiSragRqxzvoBW0IJIxhdEpkshQ2QrJtzomIKritK9WoM7pni6EjZm22iFJyjdWAcgkUWCF1wuPMAimPwGkZvgcmrQnDOqmFOD5pxReUiwVLCQUlChIIKhgiGCooIiv4kHykSYj4I7HdG3bb89H4nQ4Mr4AXiPZzM0RoKHFR/WGXSEXmDHaToj3Mkld1mA3/gCrXs1vl7stYYAAAAASUVORK5CYII="> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAY1BMVEUAAAD/mAD/mgD/mQD/mQD/mQD/mQD/mAD/mQD/mQD/mQD//wD/mQD/mAD/nwD/mQD/mAD/mQD/mQD/mgD/mAD/mQD/mAD/mAD/mQD/mgD/mQD/mgD/lwD/mQD/lQD/mwD/mQAl+fFuAAAAIHRSTlMA7ytS5M++uGk2JAGqjAzr1ZKFR/agl005MMxiYF8YF49KoKIAAAC9SURBVDjLlZJZCsMwDETl2vEWZ9+76v6nrAkhYCUR7fsyzGNgsOBP8mHIWUEiSragRqxzvoBW0IJIxhdEpkshQ2QrJtzomIKritK9WoM7pni6EjZm22iFJyjdWAcgkUWCF1wuPMAimPwGkZvgcmrQnDOqmFOD5pxReUiwVLCQUlChIIKhgiGCooIiv4kHykSYj4I7HdG3bb89H4nQ4Mr4AXiPZzM0RoKHFR/WGXSEXmDHaToj3Mkld1mA3/gCrXs1vl7stYYAAAAASUVORK5CYII="> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAY1BMVEUAAAD/mAD/mgD/mQD/mQD/mQD/mQD/mAD/mQD/mQD/mQD//wD/mQD/mAD/nwD/mQD/mAD/mQD/mQD/mgD/mAD/mQD/mAD/mAD/mQD/mgD/mQD/mgD/lwD/mQD/lQD/mwD/mQAl+fFuAAAAIHRSTlMA7ytS5M++uGk2JAGqjAzr1ZKFR/agl005MMxiYF8YF49KoKIAAAC9SURBVDjLlZJZCsMwDETl2vEWZ9+76v6nrAkhYCUR7fsyzGNgsOBP8mHIWUEiSragRqxzvoBW0IJIxhdEpkshQ2QrJtzomIKritK9WoM7pni6EjZm22iFJyjdWAcgkUWCF1wuPMAimPwGkZvgcmrQnDOqmFOD5pxReUiwVLCQUlChIIKhgiGCooIiv4kHykSYj4I7HdG3bb89H4nQ4Mr4AXiPZzM0RoKHFR/WGXSEXmDHaToj3Mkld1mA3/gCrXs1vl7stYYAAAAASUVORK5CYII="> </div> </div> <div class="download_card_btn"> <img style="border-radius: unset;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTU2MjU5MTk0MTg2IiBjbGFzcz0iaWNvbiIgc3R5bGU9IiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjY0MDciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMzIiIGhlaWdodD0iMzIiPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTQzMiAwaDE2MGMyNi42IDAgNDggMjEuNCA0OCA0OHYzMzZoMTc1LjRjMzUuNiAwIDUzLjQgNDMgMjguMiA2OC4yTDUzOS40IDc1Ni42Yy0xNSAxNS0zOS42IDE1LTU0LjYgMEwxODAuMiA0NTIuMmMtMjUuMi0yNS4yLTcuNC02OC4yIDI4LjItNjguMkgzODRWNDhjMC0yNi42IDIxLjQtNDggNDgtNDh6IG01OTIgNzUydjIyNGMwIDI2LjYtMjEuNCA0OC00OCA0OEg0OGMtMjYuNiAwLTQ4LTIxLjQtNDgtNDhWNzUyYzAtMjYuNiAyMS40LTQ4IDQ4LTQ4aDI5My40bDk4IDk4YzQwLjIgNDAuMiAxMDUgNDAuMiAxNDUuMiAwbDk4LTk4SDk3NmMyNi42IDAgNDggMjEuNCA0OCA0OHogbS0yNDggMTc2YzAtMjItMTgtNDAtNDAtNDBzLTQwIDE4LTQwIDQwIDE4IDQwIDQwIDQwIDQwLTE4IDQwLTQweiBtMTI4IDBjMC0yMi0xOC00MC00MC00MHMtNDAgMTgtNDAgNDAgMTggNDAgNDAgNDAgNDAtMTggNDAtNDB6IiBmaWxsPSIjZmZmZmZmIiBwLWlkPSI2NDA4Ij48L3BhdGg+PC9zdmc+" alt=""> <div class="downlod_btn_right"> <div>点击下载文档</div> </div> </div> </a> <div class="tag"> 相关专题 </div> </div> <div class="other"> <div class="title"><code>相关范文推荐</code></div> <div class="conter_main_634_three clearfix" style=" float:left;"> <div class="relate_art_top"> <div class="relate_art_bot"> <ul><li>推<a href="/html/4de89b9db922e0d1.html" title="HTML规则学习总结" target="_blank">HTML规则学习总结</a></li><li>推<a href="/html/0d1e823fba07e99d.html" title="教学课件" target="_blank">教学课件</a></li><li>推<a href="/html/8076a7ffae8770a8.html" title="教学课件" target="_blank">教学课件</a></li><li>推<a href="/html/38750de72f646483.html" title="个人简历html语言编写" target="_blank">个人简历html语言编写</a></li><li>推<a href="/html/2de659fdb759166f.html" title="HTML实训报告" target="_blank">HTML实训报告</a></li><li>推<a href="/html/4adc7ea22f147ad6.html" title="简历(无照片).html" target="_blank">简历(无照片).html</a></li><li>推<a href="/html/d4182881801ae935.html" title="html使用自定义标签" target="_blank">html使用自定义标签</a></li><li>推<a href="/html/c4934c6c1ec0ee07.html" title="HTML第6章教案" target="_blank">HTML第6章教案</a></li><li>推<a href="/html/3e48765b527174b9.html" title="HTML基本语法讲解" target="_blank">HTML基本语法讲解</a></li></ul> </div> </div> </div> </div> </div> </div> <div id="mainright"> <div class="hot-right"> <div class="right_fix"> <div class="hot-right-2"> <div class="hot-right-2-title">热门文章</div> <ul><li><a href="/html/64ae999ef7d02433.html" title="保健老师工作总结.html" target="_blank">保健老师工作总结.html</a></li><li><a href="/html/216078bcab5bb5b5.html" title="html网页设计总结" target="_blank">html网页设计总结</a></li><li><a href="/html/db016a368037392e.html" title="html和c总结" target="_blank">html和c总结</a></li><li><a href="/html/0e3cccebc36ba5b5.html" title="网页制作HTML总结" target="_blank">网页制作HTML总结</a></li><li><a href="/html/4c3db60c03e3cdbd.html" title="九寨沟教学课件" target="_blank">九寨沟教学课件</a></li><li><a href="/html/64cf182e7a2baf58.html" title="课件教学视频" target="_blank">课件教学视频</a></li><li><a href="/html/24995d1b4227b462.html" title="健美操教学课件" target="_blank">健美操教学课件</a></li><li><a href="/html/cd4274c30d6b897b.html" title="教学家长会课件" target="_blank">教学家长会课件</a></li></ul></div> <div class="article2-right-1"> <div class="hot-right-2-title">编辑推荐</div> <ul><li><a href="/html/12c5191444c62ead.html" title="设计教学课件" target="_blank">设计教学课件</a></li><li><a href="/html/4e9c9ac1c1e29500.html" title="课件教学设计" target="_blank">课件教学设计</a></li><li><a href="/html/230c78adad9eaedc.html" title="升国旗教学课件" target="_blank">升国旗教学课件</a></li><li><a href="/html/55e5f584ee09ad3b.html" title="教学课件设计" target="_blank">教学课件设计</a></li><li><a href="/html/97158e9b6720b6b6.html" title="狼教学课件" target="_blank">狼教学课件</a></li><li><a href="/html/d68030a33c3017ed.html" title="《月光曲》教学课件" target="_blank">《月光曲》教学课件</a></li><li><a href="/html/863740a27d904067.html" title="《珍珠鸟》教学课件" target="_blank">《珍珠鸟》教学课件</a></li><li><a href="/html/a625ca3bd49115c9.html" title="教学课件珍珠鸟" target="_blank">教学课件珍珠鸟</a></li></ul> </div> </div> </div> </div> </div> <div class="fixed_item"><a tpid="12" href="#" target="_self" class="jhcdown" rel="nofollow">点击下载本文文档</a></div> <div class="footer"> <div class="copyright"> Copyright © 2016-2020<a href='/'>人人范文网</a>(www.inrrp.com.cn) All Rights Reserved.<a href="http://www.beian.miit.gov.cn" rel="nofollow">浙ICP备2020041812号-1</a> </div> </div> <script type="text/javascript" src="/skin/default/js/right.js?v2022"></script> <div class="sidetop"><ul><li class="backtop" style="display: none;"><a id="top" href=" ">回顶部</a></li></ul></div> <script type="text/javascript"> $(function(){ $(window).on('scroll',function(){ let scrollTop = document.documentElement.scrollTop || document.body .scrollTop let windowHeight = document.documentElement.clientHeight || document.body .clientHeight let scrollHeight = document.documentElement.scrollHeight || document.body .scrollHeight if (scrollTop >= 280) { $('.conttop').addClass('conttop_te'); } else { $('.conttop').removeClass("conttop_te"); } if (scrollHeight - windowHeight - scrollTop <= 100) { $('.conttop').removeClass("conttop_te"); } }) }); $(document).ready(function() { $(window).scroll(function(){ if ($(window).scrollTop()>50){ $('.sidetop .backtop').fadeIn(800); } else { $('.sidetop .backtop').fadeOut(800); } }); $("#top").click(function(){ $('body,html').animate({scrollTop:0},300); return false; }); }); $(window).on("scroll",function(){ if($(window).scrollTop()>200){ $(".right_fix").attr("style","position: fixed; top: 10px;") }else{ $(".right_fix").attr("style","") } }); </script> </body> </html>