资源描述:
《网页设计基础案例与上机手册》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库。
1、Web应用开发工程师案例资源库Web系统与技术第二部分《网页设计基础》案例手册清华大学计算机与信息管理中心85清华大学计算机与信息管理中心Web应用开发工程师案例资源库一、HTML部分案例:案例编号:HTML-01案例名称:认识HTML的基本标签和属性1、案例目标及知识点通过制作简单的HTML页面,对HTML的标签和属性有个宏观的认识,激发学生对HTML语言的兴趣。运用了body的属性:text、background、alink、leftmargin、topmargin熟悉这些属性的用途和设置方法。2、案例功能说明做
2、出符合以下要求的网页:(1)将网页标题设置为:欢迎来到我的个人网页;(2)将网页背景设置为指定图片:(3)将网页的文本颜色设置为:#660033(4)将网页的左边距设置为:10px,上边距设置为:400px;(5)将网页以文件名为:例1-2.html保存。实验结果参照页面美化效果,如下图:85清华大学计算机与信息管理中心Web应用开发工程师案例资源库图1-13、案例操作步骤(1)在HTML的编辑页面输入源码。(2)将此HTML代码以.html或者.htm作为扩展名,保存到相应文件夹下,例如:保存为例1-2.html在
3、d盘根目录下;(3)将背景图片tp.jpg放到相对路径为images的文件夹下,如果图片比页面小,图片会自动重复;(4)用网页浏览器打开此HTML页面,即可以看到此页的页面效果。4、案例参考源码源码1.1
欢迎来到我的个人网页我的第一个HTML页面4、html>5、案例思考与扩展(1)页面的汉字“我的第一个HTML页面”在网页中居左或居右怎么设置?(2)背景如果不用图片,用一种颜色,应怎样修改源码?案例编号:HTML-02案例名称:文字的排版1、案例目标及知识点综合练习HTML网页的设计。注意代码中对
、
、
、
、、等标签的运用,熟悉并掌握文字排版所涉及的所有标签。2、案例功能说明做出符合要求的静态HTML网页,实验结果参照如下图:85清华大学计算机与信息管理中心Web应用开发工程师案例资源库图1-23、5、案例操作步骤(1)在HTML的编辑页面输入代码。(2)将此HTML代码以.html或者.htm作为扩展名,保存到相应文件夹下,例如:保存为例2-1.html在d盘根目录下;(3)用网页浏览器打开此HTML页面,即可以看到此页的页面效果。1、案例参考源码源码1.2
欢迎来到我的个人网页要
在一段
里
换行
请使用
br这个Tag。6、
这是85清华大学计算机与信息管理中心Web应用开发工程师案例资源库预设(preformatted)文本.在pre这个tag里的文本保留空格和分行。
用hr这个Tag可以在HTML文件里加一条横线。用hr这个Tag可以在HTML文件里加一条横线。代码注释
7、是不会显示在网页里的。
北京 <<网页设计基础>> 路1000号
& 老师 ©
邮编:100000