网页制作第14章超文本编程技术.pptVIP

第 14章 超文本编程技术;课前导读;基础知识;重点知识;课堂讲解; Dreamweaver、FrontPage等网页编辑器生成的都是HTML文档，它们提供的其实都只是一个网页编辑的集成环境，采取可视化的界面，使用户不用了解具体的HTML标记，也可以十分轻松地编写出精美的网页。但如果想要更自由地控制网页的格式、效果，得到最好的代码质量，还需要学习一下HTML。;超文本标记语言（HTML）简介; HTML是Internet上用于编写网页的主要语言。HTML不需要翻译而直接由浏览器解释执行。如果不考虑ASP和PHP等，一般的网页都可以在浏览器中查看其HTML代码。HTML可以很方便地使用任何文本编辑器编辑生成，也可以很方便地在Internet上传输。事实上访问一个网页时，就是从服务器上下载它的源代码，然后使用网页浏览器自带的解释器解释执行该源代码，按照解释结果将网页展现在我们面前。因此同一个网页，在不同的浏览器或同一浏览器的不同版本上的显示效果都很可能是不一样的。;HTML基本概念;HTML语法特征; 在用浏览器显示时，标记b和/b不会显示，浏览器在文档中发现了这对标记，就将其中包容的文字（如前面的“粗体显示”）以倾斜方式显示。 HTML的语法规则有以下3种表达方式： 标记对象/标记 标记 属性1=参数1 属性2=参数2…对象/标记 标记 语句中标记的书写不分大小写。下面分别对3种标记形式进行介绍。;标记对象/标记 该语法显示了使用封闭类型标记的形式。多数标记是封闭类型的，它们成对出现，在对象内容的前面是一个标记，在对象内容的后面是另一标记，第二个标记元素前带有反斜线，表明结束标记对对象的控制。如i国际名牌进军中国/i表示浏览器以斜体的形式显示“国际名牌进军中国”，如图15-1所示。; 如果一个该封闭的标记而没有被封闭，则会随浏览器的不同而出现各种错误。如忘记用/i标记封闭“国际名牌进军中国”文本，则后面输入的所有文字都会以斜体的形式出现，如图15-2所示。;标记 属性1=参数1 属性2=参数2…对象/标记 该语法显示了使用封闭类型标记的扩展形式，利用属性可以进一步设置对象某方面的内容，而参数则是设置的结果。如a href=””导向科技主页/a。a和/a是锚标记，用于在文档中创建超级链接，href是该标记的属性之一，用于设置超级链接所指向的地址，在“=”后面的就是href属性的参数，对象是“导向科技主页”文本，在浏览器中预览如图15-3所示。 一个标记的属性可以有多个，在描述完一个属性后，输入一个空格，然后继续描述其他属性。;标记 该语法显示了使用非封闭类型标记的形式，在HTML语言中，非封闭类型很少，但的确存在，最常用的是br换行标记。 如若要使一段文字换行显示可以在文字要换行的地方添加换行标记br。如：美丽容颜br从今开始，在浏览器上就会以一段两行显示，如图15-4所示。; HTML代码都是由以上3种标记形式组合而成的，标记之间可以相互嵌套，形成更为复杂的语法。如：bi /i/b，则文本会以粗体和斜体显示，如图15-5所示。;HTML的基本文件格式; HTML文件具有以下几个特点。 在一个HTML文件的开头必须加上html标记说明下面的文件属于HTML文件，这样浏览器才能正确识别，在文件结束时还应加上文件的终止标记/html，浏览器解释文件时发现有这个标记时就会停止执行。 在head起始标记开始到/head终止标记内的文本都属于HTML文件的文件头。它只定义HTML文件需要特殊处理的一些预先说明，并不属于HTML文件内容，因此这部份内容并不在浏览器中显示。 tittle标记用于说明此份文件的标题，说明此页HTML文件的标题是什么，当浏览器浏览该文件时，会将标题显示在浏览器最上方的标题栏内。;在编辑HTML时，为了维护文件方便或容易阅读，可以在文件内加上注解进行说明。注释标签的格式为：!--在这里插入注释。注释标签中的内容不会显示在浏览器中。 在body和/body之间的文本是HTML文件的主体部分，也是整个HTML文件最重要的部分。;HTML基本语法;通过前面的学习，相信讲读者已经对HTML有所了解，但这还远远没有达到学习本课的目的，下面具体讲解HTML的一些基本语法，也就是各种常用的标记。;用HTML控制网页文本;续 表;用HTML控制网页图像;用HTML控制网页媒体;用HTML控制其他元素;续 表;上机实战; 览效果如图15-7所示。希望通过学习这个例子读者能掌握HTML语言的基本用