W3C标准网页制作 主讲教师:张 涛
第4讲、页面的头部标记 4.1.HTML头部标记 4.2.标题标记<title> 4.3.基底网址标记<base> 4.4.基底文字标记<basefont> 4.5.元信息标记<meta>
4.1.HTML的头部标记 一个标准HTML页面分为头部分和主体两大部分。 本章主要介绍出现在HTML页面头部的主要标记。HTML头部标记是<HEAD>,主要包括页面的一些基本描述的语句,Javascript和CSS一般都是定义在HEAD头元素中。通常我们将这两个标记之间的内容统称为HTML的“头部”。一般来说,位于头部的内容都不会在网页上直接显示,而是通过另外的方式起作用,例如,标题是在HTML的头部定义的,它不会显示在网页上,但是会出现在网页的标题栏上。 <HEAD>与</HEAD>之间的内容不会在浏览器的文档窗口显示,但是,其间的元素有特殊重要的意义。 标记 描述 <BASE> 当前文档的URL全称(基低网址) <BASEFONT> 设定基准的文字字体、字号和颜色 <TITLE> 设定显示在浏览器左上方的标题内容 <META> 有关文档本身的元信息,例如用于查询的关键词,用于获取该文档的有效期等 <STYLE> 设定CSS层样式表的内容 <LINK> 设定外部文件的链接 <SCRIPT> 设定页面中程序脚本的内容
4.2.标题标记<title> 基本语法 <TITLE>……</TITLE> HTML文件的标题显示在浏览器的标题栏,用以说明文件的用途。每个HTML文档都应该有标题,在HTML文档中,标题文字位于<TITLE>和</TITLE>标记之间。<TITLE>和</TITLE>标记位于HTML文档的头部,也即位于<HEAD>和</HEAD>标记之间。 <HTML> <HEAD> <TITLE>最新HTML标准教程</TITLE> </HEAD> <BODY> </BODY> </HTML>
4.3.基底网址标记<base> 基本语法 <BASE href=“URL” TARGET=“WINDOW_NAME”> <BASE>标记可以设定URL地址,一般常用来设定浏览器中文件的绝对路径,然后在文件中只需写下文件的相对位置,在浏览器中浏览的时候这些位置会自动附在绝对路径后面,成为完整的路径。一篇文档中<BASE>标记不能多于一个,必须放于头部,并且应该在任何包含URL地址的语句之前。 <HTML> <HEAD> <TITLE>文件的基底网址</TITLE> <BASE HREF="http://www.sina.com.cn" TARGET="_self"> </HEAD> <BODY> <A HREF="../">文件的基底网址</A> </BODY> </HTML>
4.4.基底文字标记<basefont> 基本语法 <BASEFONT FACE=“font_name” SIZE=“VALUE” COLOR="VALUE"> FACE定义了字体,不同的字体可以定义多次,字体之间使用“,”分开,如果系统中不存在第一种字体,就显示第二种字体,如果字体都不存在,就显示默认的字体。SIZE定义了字号,VALUE取值范围为从1~7。1是最小的字号,7是最大的字号。COLOR定义了颜色,VALUE定义颜色的名称或者十六进制代码。 <HTML> <HEAD> <TITLE>文件的基底文字</TITLE> <basefont face =“隶书” size=“6” color=“blue”> </HEAD> <BODY> 曾经是无意中说过的话 你还记得吗<BR> </BODY> </HTML>
4.5.元信息标记<meta> <META>标记的功能是定义页面中的信息,这些文件信息并不会出现在浏览器页面的显示之中,只会显示在源代码中。 <META>标记通过属性来定义文件信息的名称、内容等。<META>标记是实现元数据的主要标记,它能够提供文档的关键字、作者、描述等多种信息,在HTML的头部可以包括任意数量的<META>标记。 标 记 描 述 HTTP-EQUIV 生成一个HTTP标题域,它的取值与另一个属性相同,例如HTTP-EQUIV=Expires,实际取值由CONTENT确定 NAME 如果元数据是以关键字取值的形式出现的,NAME表示关键字,如Author或ID CONTENT 关键字取值的内容 定义编辑工具 设定字符集 设定自动刷新 设定自动跳转
4.5.元信息标记<meta> 定义编辑工具 使用Frontpage,Dreamweaver等多种编辑工具可以制作网页,在源代码中可以设定网页编辑器的名称。这个名称不会出现在浏览器的显示中。 基本语法 <META name=“GENERATOR” CONTENT=“VALUE”> 代码实现 < HTML> <HEAD> <TITLE>文件的编辑器</TITLE> <META NAME=“GENERATOR” CONTENT=“Notepad”> </HEAD> <BODY> </BODY> </HTML>
4.5.元信息标记<meta> 设定字符集 HTML页面的内容可通过不同的字符集来显示,如中国内地常用的GB码(简体中文),中国台湾地区常用的BIG5码(繁体中文),欧洲地区常用的ISO8859-1(英文)等。对于不同的字符集页面,如果用户的浏览器不能显示该字符,则浏览器中显示的都是乱码。这时就需要由HTML语言来定义页面的字符集,用以告知浏览器以相应的内码显示页面内容。 基本语法 <META http-equiv=“content-type” content=“text/html;CHARSET:VALUE”> 代码实现 <HTML> <HEAD> <TITLE>页面的字符集</TITLE> <META HTTP-EQUIV=“CONTENT-TYPE” CONTENT=“TEXT/HTML;CHARSET=gb2312”> </HEAD> <BODY> </BODY> </HTML>
4.5.元信息标记<meta> 设定自动刷新 使用HTTP-EQUIV属性中的REFRESH能够设定页面的自动刷新,就是每隔几秒的时间刷新页面的内容。例如常用的互联网现场图文直播、论坛消息的自动更新、聊天室等。 基本语法 <META HTTP-equiv=“REFRESH” CONTENT=“VALUE”> 代码实现 <HTML> <HEAD> <TITLE>页面的自动刷新</TITLE> <META HTTP-EQUIV=“REFRESH” CONTENT=“180”> </HEAD> <BODY> <P>本页面每隔三分种自动刷新一次。</P> </BODY> </HTML>
4.5.元信息标记<meta> 设定自动跳转 使用HTTP-EQUIV属性中的REFRESH不仅能够完成页面自身的自动刷新,也可以实现页面之间的跳转过程。如我们的网站地址有所变化,希望在当前的页面中等待几秒钟之后就自动跳转到新的网站地址,可以通过设定跳转时间和地址来实现。自动跳转特性目前已经被越来越多的网页所使用。例如,可以首先在一个页面上显示欢迎信息,经过一段时间,自动跳转到指定的网页上。 基本语法 <META HTTP-equiv=“REFRESH” CONTENT=“VALUE;URL=URL_VALUE”> 代码实现 <HTML> <HEAD> <TITLE>页面的自动跳转</TITLE> <META HTTP-EQUIV=“REFRESH” CONTENT=“5;URL=http://210.46.102.123 ”> </HEAD> <BODY> <H2><CENTER>请稍等片刻……</CENTER></H2> <P>本页面5秒钟之后跳转到新的地址</P> </BODY> </HTML>
谢谢!