html语言教程教案,HTML语言与网页制作教案.doc-程序员宅基地

技术标签: html语言教程教案  

名师精编优秀教案

HTML语言与网页制作教案

城步职业中学:刘红兰

教学内容: HTML语言与网页制作

教学目的: 1、掌握 输入和运行HTML文件的方法

2、掌握 HTML基本的结构标记

3、掌握 html 在网页特效中的简单运用

教学重点: HTML基本的结构标记

教学难点: html 在网页特效中的简单运用

教学方法:演示法

教学地点:多媒体

教学课时: 1 课时

教学过程 :

一、什么是HTML语言

网页是由一种称为HTML的语言来描述的,网站中的大多数网页都以HTML文件的

形式保存, HTML( HyperTextMark-upLanguage )即 超文本标记语言,是 WWW的描

述语言。下面,让我们来看一看下面这个例子吧!

如果我们要在网页中显示“ 城步职业中专计算机16 班!” 一行文字, 可以用 HTML

语句来描述:

测试页面

城步职业中专计算机16 班!

输入并运行以上文件, 可以看到如下的内容。

二、输入和运行HTML文件的方法

名师精编优秀教案

1.编辑

HTML文件所使用的软件

我们可以使用任何一种文本编辑软件来输入、修改

记事本、写字板、Edit 、 Word等等。专业一点的有

HTML文件。简单一点的有

EditPlus等。

Windows 中的

2 .

输入

HTML文件的方法

逐字键入英文和汉字,每键入一行,击一次回车键。

3 .保存 HTML文件的方法

不管使用那种软件,都要注意将HTML文件另存为 “ 文本文件 ”(即 TXT 文件),而且

文件后缀 ( 即扩展名 ) ,应该是html或 htm。

运行 HTML文件的方法

双击文件名,即可打开浏览器运行文件。四、 常用的 HTML标记

(一 )基本的结构标记

(1)开始和结束标记

表示 HTML语句开始

.....

表示 HTML语句结束

头部标记

......

头部结束

标题标记

标题开始

.....

标题结束

网页主体标记

......

网页主体结束

[例题 1]HTML文件的结构

这是网页的标题,显示在浏览器的标题栏 此行信息叫做 " 头信息 " (标题和头信息是可有可无的)

名师精编优秀教案

在两个

Body

之间的是网页的主体信息

主体信息可以有

图片、

文字、

表格、

动画等等

运行结果如下:

( 二 )

常用的标记

1.

换行标记

(

单个使用 )

2.

水平线标记


(

单个使用 )

段落标记

......< /p>

[例题 2 ]画水平线

COLOR="#cd061f">欢迎您光临!

名师精编优秀教案

运行结果如下

背景色标记

< bodyBGCOLOR=" 颜色代码 " >

5.背景图形标记

< bodyBACKGROUND=" 图形文件名 " >

五、网页特效例题先弹出一个欢迎窗口

在网页 HTML代码的 < BODY >内插入 script指令,使之成为

使别人在打开网页之前先弹出一个欢迎窗口。

六、作业

用 HTML语言编写一个网页,要求网页的背景色为蓝色,字体为楷体红色7 号字,文字内容

为“计算机16 班网页制作课,HTML语言的学习“,并且画一根水平线。

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_42410443/article/details/117763442

智能推荐

bzoj3298-程序员宅基地

文章浏览阅读151次。分析:。。美国人民脑洞大。。。注意格式。。具体题解%http://www.bubuko.com/infodetail-740656.html#include#include#include#include#define fo(i,a,b) for(int i=a;i<=b;i++)using namespace s

L Machining Disc Rotors_l. machining disc rotors-程序员宅基地

文章浏览阅读242次。L Machining Disc Rotors题意:圆心为(0,0)半径为R的圆,现在被被n个互不相交的圆切割(圆心和半径会给出),保证这n个彼此之间不会交叉,保证n个圆中不会有某个包含整个大圆的情况。问切割后大圆剩余部分的直径(即两点的最远距离)题解:圆上的最远距离就是半径,如果存在一个点没被切割,然后求其关于圆心作对称点,如果对称点也存在就说明构成了一条没有被切掉的直径。如果直径不存在,答案就是两个交点之间的最大距离(即图中情况)这个题最难的是写代码。。。头大,计算几何一看就头大代码:_l. machining disc rotors

python 插入clickhouse数据报错_cannot parse json string: expected opening quote:-程序员宅基地

文章浏览阅读2.2k次。python 插入clickhouse报错 clickhouse : Cannot parse JSON string: expected opening quote: (while read the value of key data): (at row 1): While executing SourceFromInputStream 最近工作需要使用clickhouse_cannot parse json string: expected opening quote:

开源软件如何赚钱?_b) 公司如何从“免费”的开源软件中赚钱?-程序员宅基地

文章浏览阅读1.4w次,点赞9次,收藏13次。所谓开源就是开放源代码。源代码是软件的本质,所有程序都有源代码,就像人类的语言一样,有词汇和语法。源代码可以说是一个作者的主要命脉了。一般软件作者将软件的源代码开放出来,以保障软件用户自由使用及接触源代码的权利。这同时也保障了用户自行修改、复制以及_b) 公司如何从“免费”的开源软件中赚钱?

使用标准库:文本查询程序_用txt文档制作查询程序-程序员宅基地

文章浏览阅读168次。最近打算学习c++11 中智能指针的使用,写了一个文本查询程序。功能有读入一个“.txt”文件,在其中找单词“london”,具体格式见图://TextQuery.cpp#include "TextQuery.h"#include&lt;iostream&gt;#include&lt;fstream&gt;using namespace std;void runQueries(s..._用txt文档制作查询程序

单行文本省略和多行文本省略_实现单行文本缩略和多行文本省略-程序员宅基地

文章浏览阅读262次。单行文本省略overflow: hidden;text-overflow:ellipsis;white-space: nowrap;多行文本省略display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;_实现单行文本缩略和多行文本省略

随便推点

求某个节点的所有父节点_sqlserver根据子节点获取它对应的所有父节点-程序员宅基地

文章浏览阅读1.1k次。package com.fh.service.xtgl;import com.fh.util.PageData; import org.springframework.stereotype.Service;import javax.annotation.Resource; import java.util.ArrayList; import java.util.List;//根据_sqlserver根据子节点获取它对应的所有父节点

C# 自定义控件制作和使用实例_c# vs2017 自定义控件 开发流程-程序员宅基地

文章浏览阅读3.8w次,点赞16次,收藏75次。C# 自定义用户控件xiongxuanwen 上篇:控件制作 本例是制作一个简单的自定义控件,然后用一个简单的测试程序,对于初学者来说,本例子比较简单,只能起到抛石引玉的效果。我也是在学习当中,今后会将自己所学的逐步写出来和大家交流共享。 第一步:新建一个控件库项目:myControl 第二步:从工具箱里面拖动1个PictureBox、1个Button、6_c# vs2017 自定义控件 开发流程

maven五:查找jar包坐标,选择jar包版本_在一个maven工程中,如何快速判断一个jar的版本是在哪里定义的?-程序员宅基地

文章浏览阅读1.5w次,点赞9次,收藏14次。查找jar包坐标以spring core的jar包为例,访问http://www.mvnrepository.com/ 在最上方中间,输入spring core,点击Search。搜索结果第一个就是,点击spring core有很多版本,这里点击4.3.5.RELEASE点击maven栏里面的内容,允许访问,会复制到剪贴板然后直接粘贴到pom.xml文件的_在一个maven工程中,如何快速判断一个jar的版本是在哪里定义的?

linux卸载图形逻辑卷界面,使用lvremove命令在Linux系统中删除LVM卷(逻辑卷)-程序员宅基地

文章浏览阅读948次。如果Linux系统上的LVM不再需要使用LVM卷(逻辑卷),您可以使用lvremove命令按照以下步骤删除它。但是请确保LVM卷不包含任何数据,如果是,请确保在继续删除LVM之前备份该数据。为了说明这一点,我们将从卷组“vg01”中删除“lv001”,LV安装在挂载点/lvmtest上。参考lvremove命令_Linux lvremove命令使用详解:删除指定LVM逻辑卷。实施的方法使用df命令..._lvremove

最适合物联网LOT的开源数据库_lot 数据库有哪里-程序员宅基地

文章浏览阅读2.4k次。最适合物联网的开源数据库https://blog.csdn.net/shnbiot/article/details/80693520_lot 数据库有哪里

H - Fence-程序员宅基地

文章浏览阅读106次。H - FenceThere is a fence in front of Polycarpus’s home. The fence consists of n planks of the same width which go one after another from left to right. The height of the i-th plank is hi meters, distinct planks can have distinct heights.Fence for n = 7

推荐文章

热门文章

相关标签