下载此文档

网页制作教案(2).doc

文档分类：IT计算机 | 页数：约3页举报非法文档有奖

1/3

下载提示

1.该资料是网友上传的，本站提供全文预览，预览什么样，下载就什么样。
2.下载该文档所得收入归上传者、原创者。
3.下载的文档，不会出现我们的网址水印。

同意并开始全文预览

(约 1-6 秒)

1/3 下载此文档

文档列表 文档介绍

Hello world页面
打开记事本,输入以下内容,保存为html格式,再通过浏览器打开观察效果:
<html>
<head>
<title>My first page</title>
</head>
<body>
Hello world.
</body>
</html>
用尖括号括起来的部分称作标签。目前接触到的标签都是成对出现的,如:<html>是开始标签,</html>是结束标签。标签可以嵌套,形成树状的层次。
标签的大小写是不敏感的,但是推荐使用小写,以符合W3C标准。
HTML文档必备的四个标签
HTML文档万变不离其宗,有四个标签是必须具备的。
- html:标签之间的文本描述网页,是整个文档的根节点
- head:头部容器,可以包括脚本、样式表、元信息等内容
- title:文档的标题,比如放在head标签内
- body:之间是课件的页面内容
meta元信息
meta标签位于head标签内,是单独呈现的:<meta……/>
meta有几个常用的用途:
- 为页面设置关键字:<meta name=”keywords” content=”HTML, SISO, ITO”/>
其中name和content被称为标签的属性。属性的值如”keywords”必须用双引号括起来
keywords的意义在于,当搜索引擎遇到关键字时,可以对文档进行正确的分类
- 为页面添加简短描述:<meta name=”description” content=”This is my first page”/>
- 为页面设置缓存过期时间:<meta http-equiv=”expires” content=”9 Sep 2013 10:00”/>
文字段落
浏览器会忽略正文多余的空格和换行。如果希望某段文字自称段落,应当使用<p>标签,如:
<p>春眠不觉晓,</p>
<p>处处闻啼鸟。</p>
<p>夜来风雨声,</p>
<p>花落知多少。</p>
浏览器会在p元素的前后自动创建一些空白。
如果仅仅是换行,可以在文字后使用<br />标签。
让学生在自己机器上体会p和br的区别
文字标题<h1>-<h6>
可以定义标题,h1定义最大的标题,h6定义最小的标题。
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6>
实验以上代码的效果。提醒学生注意,将此标签用于标识标题文本,而不要仅仅为了文字大小、粗细而使用它们。
文字效果
在段落中为文字添加效果,如:
<p style=”font-family:微软雅黑;font-size:small;color:blue”>春眠不觉晓,</p>
<p style=”font-family:微软雅黑;font-size:small;color:blue”>处处闻啼鸟。</p>
<p sty

网页制作教案(2) 来自淘豆网www.taodocs.com转载请标明出处.