1 / 16

语言入门

语言入门. 靖江市第一高级中学 叶 露. HTML 语言入门. 什么是 HTML 也就是超文本标记 语言. HTML 语言入门. 一、 HTML 的基本结构 二、常用 HTML 介绍 三、 HTML 的发展. 一、 HTML 的基本结构. 头部(head)提供关于网页的信息 , 此对标记之间的内容不会在浏览器的主窗口显示. 主体( body )部分提供网页的具体内容 , 此对标记之间的内容将在浏览器的主窗口显示. <html> </html>. <head> <title> 网页标题 </ tilte>

Download Presentation

语言入门

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. 语言入门 靖江市第一高级中学 叶 露

  2. HTML语言入门 • 什么是HTML • 也就是超文本标记语言

  3. HTML语言入门 • 一、 HTML的基本结构 • 二、常用HTML介绍 • 三、HTML的发展

  4. 一、 HTML的基本结构

  5. 头部(head)提供关于网页的信息,此对标记之间的内容不会在浏览器的主窗口显示头部(head)提供关于网页的信息,此对标记之间的内容不会在浏览器的主窗口显示 主体(body)部分提供网页的具体内容,此对标记之间的内容将在浏览器的主窗口显示 <html> </html> <head> <title>网页标题 </tilte> </head> <body> </body>

  6. 学生实践1: • 1.打开“附件”中的“记事本”,在记事本中输入html基本结构,并将文件保存在D:\mzd文件夹中,文件名为“index.htm”。 • (1).网页主体部分显示“美丽的马洲岛” • (2).添加网页标题“爱我靖江” • <title>爱我靖江</title>

  7. 思考 • 在IE浏览器中打开保存过的“index.html”,看看显示的结果是什么,通过这段代码,你能否发现HTML语言的一些简单规律及特征?

  8. 二、常见的HTML标记 • HTML标记:<html> </html> • 头部信息:<head> </head> • 主体标记:<body> </body>

  9. 学生实践2 • 1、请把马洲岛的介绍添加到网页中去。 • 如何分段 • <p> </p>段落标记 • 2、将“美丽的马洲岛”居中 • <p align=”center”>美丽的马洲岛</p> • 3、网页背景的设置 • 设置背景颜色 <body bgcolor=”grey”> • 设置背景图片 • <body background=”bj5.jpg”>

  10. 标签和属性 <水果> </水果> 苹果 <标签1>……</标签1> <title>欢迎</title> <水果 颜色=“红”>苹果</水果> <水果 颜色=“红” 形状=“圆”>苹果</水果> <标签1 属性名=“属性值”>……</标签1> <body bgcolor=“#ccdecc”>赤子之心环保社团</body>

  11. 学生实践3(一) • 1、设置网页背景音乐为“autumn.wav” • 在<head>区域插入标记 • <bgsound src=“声音文件路径及文件名”> • 例:<bgsound src=”autumn.wav”> • 2、在“美丽的马洲岛”标题和马洲岛的介绍中间插入水平线 • <hr> 水平线

  12. 学生实践3(二) • 3、在水平线下面插入图片 • <img src=”文件地址\文件名”> • 例:<img src=”2.jpg”> • 4、将“百度一下”四个字链接到www.baidu.com • <a href=http://www.baidu.com>百度一下</a> • 5、插入滚动字幕“马洲岛欢迎您!” • <marquee>马洲岛欢迎您</marquee>

  13. HTML的发展 • 从1993到现在,HTML语言有着很大的发展,最新版本是HTML5

  14. 拓展 • 用frontpage打开index.html,对网页进行美化,并将相应代码填在下面的表格中

  15. 总结 • 1、HTML文档本身是文本格式的文件,所以HTML代码可由任何一种文本编辑软件如记事本,写字板和WORD等进行编辑,保存后,把文件的扩展名改为.htm或.html就可以用浏览器浏览到相应的网页

  16. 总结 • 2、HTML的基本结构 • HTML标记:<html> </html> • 头部信息:<head> </head> • 主体标记:<body> </body> • 3、常见的HTML标记

More Related