HTML-Web页面制作基础.ppt

模块3 HTML语言 ;3.1 HTML语言概述 ; 任何一个Web页面都离不开HTML，HTML也是Web应用开发的基础。 HTML语言是大多数浏览器都能识别的语言。 ;常用HTML编辑工具 任何一个文档编辑器都是HTML编辑器。 很多公司设计了专用的网页编辑器，像Dreamweaver，FrontPage，CutePage，QuickSite等，是专门用来制作网页的，利用它们可以很容易的编写出精美的网页，具有所见即所得的功能。 ;HTML文档的结构 HTML HEAD 头部信息 /HEAD BODY 正文部分 /BODY /HTML ;HTML标记 1．HTML文档标记 格式：HTML…/HTML 功能：标志文档开始和结尾的标记。 3．HTML文件头标记 格式：HEAD…/HEAD 功能：用于包含文件的基本信息。 3．HTML文件主体标记 格式：BODY…/BODY 功能：文件主体标记。 ;1. 文档头标记 HTML文档的HEAD部分是文档头，在文档头中常用的一些标记有： （1）TITLE标记 用于定义网页标题栏上的显示内容。 例如：HEAD TITLE这是标题部分。 /TITLE /HEAD ;（2）META标记：放于HEAD与/HEAD之间的标记，功能为： 1）定义该网页的关键字，可以使搜索引擎根据关键字搜索到我们网站的页面。 例meta name=“Keywords” content=“Chris,Web,Music,photo” 其中name=“Keywords” 说明要定义关键字， Chris,Web,Music,photo是给搜索引擎搜索的关键字 2）页面刷新和自动跳转 meta http-equiv=“refresh” content=“10;url=” 其中refresh表示设置页面的刷新，10表示10秒，url指明刷新后要跳转到的页面;HTML标准单位 ;2、颜色单位(colorvalue) 网页颜色的表示共有五种方式 （1）#RRGGBB：每种颜色取值范围00~FF （2）#RGB：每种颜色取值范围0~F （3）rgb(R,G,B)：每种颜色取值范围0~255 （4）rgb(R%,G%,B%)：相对比例 （5）Color_Name：有141种标准色 例如Black\Navy\Gray\Lime\Purple\Sliver等等;3、URL路径 URL（Uniform Resource Locator：统一资源定位器）是WWW页的地址。 有绝对路径： a href=“/index.jsp” a href=“file:///c:/doc/11/home.doc” 和相对路径： IMG src=“pic/show.jpg” IMG src=“../image/leaves.jpg”;文档的格式与风格;1 设置BODY的属性;bgproperties =fixed ;段落格式化 1．标题标记 格式：H1…/H1， H3…/H3，H6…/H6 功能：设置各种大小不同标题的标记。 3．段落标记 格式：P…/P 功能：设置段落标记。 3．预定义格式标记 格式：PRE…/PRE ;4．分区显示标记 格式：DIV…/DIV 功能：分区显示标记。 5．换行标记 格式：BR 功能：强制换行。 6．水平线标记 格式：HR 功能：插入水平线标记。 7．注释标记 格式：!--注释内容-- 功能：注释标记。;HTML HEADTITLE标记的使用/TITLE/HEAD BODY ！--注释本程序的功能是：制作简单网页熟悉基本标记的使用！ -- P align=center三种标记的使用！/PHR DIV align=center我在中间！ BR中间/DIVHR DIV align=left我在左边！BR左边/DIVHR DIV align=right我在右边！BR右边/DIV HR/BODY/HTML ;建立列表 1．有序列表/标号列表 格式：OL type=“” start= LI type=“…/LI LI type= …/LI …………… /OL OL的start属性：设定从何数值开始标号，默认为1。 LI 的type属性：用来设定标号的样式，例如数字（1，2…）、大写英文字母（A，B…）、小写英文字母（a，b…）、大写罗马字母（I，II…）和小写罗马字母（i，ii…），默认的序号是数字。 ;2．无序列表/项目列表 格式：UL LI type=…/LI LI type=…/L