- 1、本文档共93页,可阅读全部内容。
- 2、原创力文档(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
- 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
查看更多
南雄市中等职业学校计算机学科校本教材
-_
PAGE 2
一、HTML部分
一、实例名称:认识HTML的基本标签和属性
实例目标及知识点
通过制作简单的HTML页面,对HTML的标签和属性有个宏观的认识,激发学生对HTML语言的兴趣。
运用了body的属性:text、background、alink 、 leftmargin、 topmargin
熟悉这些属性的用途和设置方法。
实例功能说明
做出符合以下要求的网页:
将网页标题设置为:欢迎来到我的个人网页;
将网页背景设置为指定图片:
将网页的文本颜色设置为:#660033
将网页的左边距设置为:10px ,上边距设置为:400px ;
将网页以文件名为:例1-2.html保存。
实验结果参照页面美化效果,如下图:
图1-1
3、实例操作步骤
在HTML的编辑页面输入源码。
将此HTML代码以.html或者.htm作为扩展名,保存到相应文件夹下,例如:保存为例1-2.html在d盘根目录下;
将背景图片tp.jpg放到相对路径为images的文件夹下,如果图片比页面小,图片会自动重复;
用网页浏览器打开此HTML页面,即可以看到此页的页面效果。
4、实例参考源码
源码1.1
html
head
title欢迎来到我的个人网页/title
/head
body text = #660033 background = images\tp.jpg alink = blue leftmargin = 10 topmargin = 400
center我的第一个HTML页面/center
/body
/html
5、实例思考与扩展
(1)页面的汉字“我的第一个HTML页面”在网页中居左或居右怎么设置?
(2)背景如果不用图片,用一种颜色,应怎样修改源码?
二、实例名称:文字的排版
实例目标及知识点
综合练习HTML网页的设计。注意代码中对br、p、center、hr、pre、address等标签的运用,熟悉并掌握文字排版所涉及的所有标签。
2、实例功能说明
做出符合要求的静态HTML网页,实验结果参照如下图:
图1-2
3、实例操作步骤
在HTML的编辑页面输入代码。
将此HTML代码以.html或者.htm作为扩展名,保存到相应文件夹下,例如:保存为例2-1.html在d盘根目录下;
用网页浏览器打开此HTML页面,即可以看到此页的页面效果。
实例参考源码
源码1.2
html
head
title欢迎来到我的个人网页/title
/head
body text = #660066 bgcolor = #FFFF66
p align = center
要br在一段br里br换行br请使用brbr这个Tag。
/p
center
pre
这是
预设(preformatted)文本.
在pre这个tag里的文本 保留
空格和
分行。
/pre
/center
p align = center用hr这个Tag可以在HTML文件里加一条横线。/p
hr width = 60% size = 3 align = center noshade
p align = center用hr这个Tag可以在HTML文件里加一条横线。/p
!--这是代码注释--
centerp代码注释是不会显示在网页里的。/p
address
北京nbsp;lt;lt;网页设计基础gt;gt;nbsp;路1000号br
amp;nbsp;老师nbsp;copy;br
邮编:100000br
/address
/center
/body
/html
5、实例思考与扩展
(1)页面的背景设置成图片应该如何做?
(2)字体的大小、颜色等属性如何更改?
三、实例名称:文字的美化
实例目标及知识点
利用文字美化所讲到的标签,综合练习HTML网页的设计。
熟悉并掌握文字美化所涉及的标签。如:hn、font、del、ins、sub、sup等。
实例功能说明
按照以下要求完成HTML页面效果的制作。
将网页标题设置为:“字体设置”。
将文字“标题一”样式设置为:标题一,居中对齐。
将文字“具体内容一”设置为:隶书,18px,颜色为红色。
将文字“具体内容二”设置为:16px,粗体,斜体。
利用字体美化的标签实现删除、下划线、上标、下标等功能。
实验结果参照如下图:
图1-3
3、实例操作步骤
在HTML的编辑页面输入代码,注意此段代码中对hn、font、del、ins、sub、sup等标签的运用。
将此HTML代码以.html或者.htm作为扩展名,保存到相应文件夹下,例如:保存为例2-2.html在d盘根目录下;
用网页浏览器打开此HTML页面,即可以看到此页的页面效果。
4、实例参考
您可能关注的文档
最近下载
- Siemens 西门子家电 iQ300 滚筒洗衣机 8 kg 1000 转 分钟 WM10N1680W 使用说明书 安装说明 程序表.pdf
- 最新国家标准公文格式(20200814040051).pdf
- 中小学学校实验室安全管理制度(附详细制度).docx VIP
- 化工设备机械基础课件.pptx VIP
- 【大单元整体教学】第一单元《我们的守护者》单元整体分析.pdf
- 北师大版二年级数学上册《数学好玩》(大单元教学设计).docx
- 工程联系函(施工单位).doc VIP
- 河南省文化旅游投资集团有限公司招聘笔试题库2023.pdf
- (正式版)-B 11291.2-2013 机器人与机器人装备 工业机器人的安全要求 第2部分:机器人系统与集成.docx VIP
- 2023年河南省周口市川汇区小升初数学试卷.doc
文档评论(0)