1、网页的数据组织网页的数据组织浙教浙教版八年级版八年级上册上册学习目标通过观察和探究网页代码,认识HTML语言,掌握HTML文件的基本结构,能初步编辑HTML网页代码;在浏览网页的过程中,能理解超链接的作用。探究1.你知道网页是如何实现图片呈现的?2.超链接能链接哪些类型的文件?建构浏览网站时,人们能欣赏到组织有序且包含着丰富的文字、图片、声音、视频等内容的网页,这些都是通过HTML语言来设计、组织的。一、HTML语言HTML(HyperText Marked Language)即超文本标记语言,定义了网页内容的结构和内容。用HTML编写的超文本文件称为HTML文件,HTML文件一般通过浏览器解
2、释执行。在使用浏览器访问网页时,浏览器读取并分析 HTML文件中的代码,根据解释的结果呈现网页内容。一、HTML语言HTML文件可以使用文本编辑器编写,也可以使用专业软件编辑。网页可以通过浏览器的“开发人员工具”看到HTML代码并编辑调试。亲身体验尝试打开一个自己熟悉的网站,使用浏览器的“开发人员工具”查看,对比观察网页显示内容和对应的HTML代码。二、HTML标签HTML用标签来规定元素的属性和其在文件中的位置,一个HTML文件一般包含多个标签,HTML标签由和“”符号包围的字符串而组成,通常以成对标签出现。二、HTML标签HTML文件的基本结构:#标记网页的开始#标记头部的开始#显示网页的
3、标题#标记头部的结束#标记网页正文开始#网页内容#标记网页正文结束#标记网页的结束#二、HTML标签网页首页index.html的代码及效果图:首页的HTML代码及效果图亲身体验根据小组“人工智能”主题网站的制作方案,用HTML语言编写网 页首页的代码,尝试插入主题图片,并调试查看网页效果。教你一招为了使网页便于用户浏览,可以使用HTML标签简单设置文本版面。居中对齐:center/center网页背景色:body bgcolor=颜色名称/body字体格式:font face=字体名称size=字号数值color=颜色 名称文字/font三、超链接超文本链接(Hypertext Link)简称为超链接,可以实现从一个页面跳转到另一个页面或者跳转到页面的其他位置,实现文档互联、网站互联。三、超链接在 HTML文档中,链接元素可以是文本、图片等,建立超链接的标签为,href属性的作用是设置链接的位置,是标签必不可少的。常见的格式如下:a href=链接位置链接元素三、超链接如图:代码第8、9行分别在链接元素“发展“和“历史“建立 了超链接,点击“发展”和“历史”可打开相应的超链接文档。随堂练习1.在一个HTML文档中,用来表示网页名称的标签是_和_,表示网页主体内容的标签是_和_。2.尝试在网页中加入背景图片。INTERNET OF THINGS