第一章HTML基礎.ppt

第一章 HTML基础 1.1 什么是HTML Web页的基本概念 HTML的工作原理 创建和测试Web页 1.2创建Web页 标记符基础 Web页的基本结构 设置页面属性 添加注释 显示特殊字符 1.1.1 Web页的基本概念 Internet与WWW 浏览器 网站 主页 URL Internet 网络 数据通信网 信息资源网 www服务（网页浏览服务）（World wide web） 位于相同或不同计算机（服务器）上的网页通过超链接组织在一起，形成象蜘蛛网一样的WWW系统。 Server (服务器） Browser(浏览器） 获取WWW服务的基础，它的基本功能就是对网页进行显示。 URL Uniform resource locator（统一资源定位器：网址） 网站 一系列逻辑上可以视为整体的页面 网站就是一个链接的页面集合。 主页 主页是网站中的一个特殊的页面，它是一个组织或个人在WWW上开始点的页面，这是大多数服务器默认的索引文件。主页的名称是固定的（index.htm或index.html ） ? 注意的问题 网站中必须有一个文件的名字是“index.htm”或”index.html”这是大多数服务器默认的索引文件，别人访问你的主页的时候，这个文件就是你的主页的大门。 网页文件的名称在服务器上是区分大小写的。 1.1.2HTML的工作原理 Html（Hyper Text Markup Language） 超文本标记语言 Hypertext（超文本） 文本中包含指向其他位置或文件的链接（Hyper link）通过这些链接使文档组织成了网状结构。 原理：通过使用标记符，告诉浏览器如何显示网页，即确定内容的显示格式，浏览器按顺序读取HTML文件，根据内容周围的HTML标记符解释和显示各种内容。 网页实质就是纯文本文件 html head meta http-equiv=Content-Type content=text/html; charset=gb2312 title这是测试文件1/title /head body HTML文件就写在这里 h3 align=left文本左对齐/h3 h3 align=center文本居中对齐/h3 h3 align=right文本右对齐/h3 /body /html 创建Web页（启动记事本） 测试Web页（双击保存的文件） 网页编辑工具 HTML编辑器 Homesite Hotdog Pro等 所见即所得的编辑器Dreamwerver和Frontpage 1.2.1标记符基础 基本的HTML语法 1、标记符的结构 标记符都用尖括号括起来，标记符内容/标记符 例如：H1这里是标题文字格式/H1 2、标记符的属性 对标记符作用的内容进行更详细的控制，放在开始标记符的尖括号里， 标记符（空格）属性=“属性的值” （空格）属性=“属性的值” 内容/标记符例如： FONT size=“1” color＝“green”示例/FONT 1.2.2 Web页的基本结构 一个Web页对应一个HTML文件，以.htm或.html为扩展名，包含的最基本的标记符有： HTML和/HTML 首部标记：HEAD/HEAD 正文标记：BODY/BODY 1.2.2 Web页的基本结构 1.Html标记 2.首部标记head/head Title 标记符 Meta 标记符 设置自动转址功能 META http-equiv=“refresh” content=“10; URL=title shi li.html”/ 1.2.2 Web页的基本结构 Bgsound标记符(只有开始没有结束标记符)bgsound src=“**.mid” loop=“1” Src属性：指定背景音乐的源文件 Loop属性：指定背景音乐重复的次数 3.正文标记符 body/body包括web页的具体内容,包括各种HTML对象，如：文字、图形、超链接等等。 无格式显示 预格式化标记符：PRE/PRE 1.2.3设置页面属性 1.设置页面背景颜色： Bgcolor属性 ，代码如下： body bgcolor=“black” 下面有16种标准颜色供参考： 颜色设置的方法 直接使用颜色名称 例：body bgcolor=“black” 用格式#RRGGBB来表示颜色 通过指定颜色的红、绿、蓝含量来自定义一种颜色。 例： body bgcolor=“#000000” 1.2.3设置页面属性 2.设置页面背景图像 background