HTML基础实教程.docVIP

  • 59
  • 0
  • 约3.83万字
  • 约 93页
  • 2017-03-08 发布于广东
  • 举报
HTML基础实教程

一、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 欢迎来到我的个人网页 body text #660033 background images\tp.jpg alink blue leftmargin 10 topmargin 400 我的第一个HTML页面 5、实例思考与扩展 (1)页面的汉字“我的第一个HTML页面”在网页中居左或居右怎么设置? (2)背景如果不用图片,用一种颜色,应怎样修改源码? 二、实例名称:文字的排版 实例目标及知识点 综合练习HTML网页的设计。注意代码中对 、 、 、 、 、 等标签的运用,熟悉并掌握文字排版所涉及的所有标签。 2、实例功能说明 做出符合要求的静态HTML网页,实验结果参照如下图: 图1-2 3、实例操作步骤 在HTML的编辑页面输入代码。 将此HTML代码以.html或者.htm作为扩展名,保存到相应文件夹下,例如:保存为例2-1.html在d盘根目录下; 用网页浏览器打开此HTML页面,即可以看到此页的页面效果。 实例参考源码 源码1.2 欢迎来到我的个人网页 body text #660066 bgcolor #FFFF66 p align center 要 在一段 里 换行 请使用 br这个Tag。 这是 预设 preformatted 文本. 在pre这个tag里的文本 保留 空格和 分行。 p align center 用hr这个Tag可以在HTML文件里加一条横线。 hr width 60% size 3 align center noshade p align center 用hr这个Tag可以在HTML文件里加一条横线。 !--这是代码注释-- 代码注释是不会显示在网页里的。 北京nbsp;lt;lt;网页设计基础gt;gt;nbsp;路1000号 amp;nbsp;老师nbsp;copy; 邮编:100000 5、实例思考与扩展 (1)页面的背景设置成图片应该如何做? (2)字体的大小、颜色等属性如何更改? 三、实例名称:文字的美化 实例目标及知识点 利用文字美化所讲到的标签,综合练习HTML网页的设计。 熟悉并掌握文字美化所涉及的标签。如: 、 、 、 、 、 等。 实例功能说明 按照以下要求完成HTML页面效果的制作。 将网页标题设置为:“字体设置”。 将文字“标题一”样式设置为:标题一,居中对齐。 将文字“具体内容一”设置为:隶书,18px,颜色为红色。 将文字“具体内容二”设置为:16px,粗体,斜体。 利用字体美化的标签实现删除、下划线、上标、下标等功能。 实验结果参照如下图: 图1-3 3、实例操作步骤 在HTML的编辑页面输入代码,注意此段代码中对 、 、 、 、 、 等标签的运用。 将此HTML代码以.html或者.htm作为扩展名,保存到相应文件夹下,例如:保存为例2-2.html在d盘根目录下; 用网页浏览器打开此HTML页面,即可以看到此页的页面效果。 4、实例参考源码 源码1.3 字体设置 body text #660066 bgcolor #FFFF66 h1 align center 标题一 font face 隶书 size 18 color #FF0000 具体内容一 / font size 16 具体内容二 / 芙蓉姐姐 这个词当中划线表示删除。 想唱就唱 这个词下划线插入。 X 2 其中的2是下标 X 2 其中的2是上标 好好学习,天天向上。这句话缩进表示引用 call getOrders

文档评论(0)

1亿VIP精品文档

相关文档