HTML网页页面头顶部编码案例详解

专业知识点1:头顶部信息内容里设定网页页面的基底网站地址

基底网站地址的本质是统1设定非常连接的特性,基底网站地址标识是</base>,它有两个特性,href和_target。href用于设定基底网站地址的相对路径,_target用于设定非常连接的开启方法。

根据基底网站地址的加上,网页页面中全部的相对性网站根文件目录详细地址可变换成肯定详细地址。当访问器访问网页页面时,根据<base>标识将相对性网站跟文件目录详细地址额外在基底网站地址相对路径的后边,从而转换成肯定详细地址。大家最先建立1个base.htm,撰写HTML编码以下:


拷贝编码
编码以下:

<html>
<head>
<title>基底网站地址的设定</title>
<base href="<a href="https://www.jb51.net">https://www.jb51.net</a>" _target="_blank" />
</head>
<body>
</body>
</html>

根据以上编码对基底网站地址的设定。Base.htm网页页面中的任何非常连接的详细地址,都将在其前面再加"https://www.jb51.net",即变换为肯定详细地址。而且,网页页面中的非常连接开启方法全是开启新对话框。

专业知识点2:头顶部信息内容的元信息内容标识

元信息内容标识是头顶部信息内容的基础标识,技术专业网页页面编码中都对元信息内容有详尽设定。元信息内容标识为</meta>,为单标识。Meta元素出示的信息内容针对访问客户是不能见的,1般用于界定网页页面信息内容的名字,重要字,作者等。在HTML网页页面中,1个meta标识内便是1个meta內容,而在1个HTML头网页页面中能够有好几个meta元素。

meta标识特性分两种:网页页面叙述特性(name)和http题目信息内容(http-equiv)。

name特性

name特性关键用于叙述网页页面的內容,用于对检索模块的提升,务必关键把握。正确地设定name特性,便于检索模块(例如google,baidu)的检索设备人搜索,归类,检索模块1般都会全自动搜索meta值来给网页页面归类。name的赋值以下:

<1>keywords。即重要字,用于表明网页页面所包括的重要字等信息内容,从而提升被检索模块检索到的几率。撰写文件格式为<meta name="keywords" content =“重要字”/>,content特性的值为客户所设定的实际重要字。(1般可设定好几个重要字,她们之间用英文半角的逗号分开,检索模块都限定重要字的数量,因此重要字內容要简约精炼)

<2>description。汉语意思为"叙述",用于叙述网页页面的关键內容、主题等,有效设定还可以提升被检索模块检索到的几率。文件格式为<meta name="description" content =“对网页页面的叙述”/>,content特性值为客户所设定的网页页面实际叙述的內容,数最多容下1024个标识符,但检索模块1边只显示信息约前175个标识符。

<3>author。作者,用于设定网站作者的名字,较为技术专业的网站常常用到。文件格式为<meta name="author" content =“作者名字”/>

<4>generator。转化成器,用于设定网站编写专用工具的名字,较为技术专业的网站网页页面上常常用到。文件格式<meta name="generator" content =“网站编写专用工具名字”/>

<5>robots。设备人,用于限定网页页面检索方法。检索模块的检索设备人,沿着网页页面上的连接(如http和src连接),持续地查找材料创建自身的数据信息库。根据这类meta标识能够限定一部分內容不被检索模块检验到,减少一部分信息内容公布性。撰写文件格式为<meta name=“robots” content="命令组成">。该特性的值包括4个指令,各自是index、noindex、follow、nofollow,依据排序组成,有4种组成。Index和follow组成也可称为all,noindex和nofollow也可称为none。

http-equiv特性

http-equiv特性的赋值实际以下:

<1>content-type,內容种别,用于设定网页页面的种别和語言标识符集。撰写文件格式<meta http-equiv=“content-type” context=“text/html”;charset=“gb2312”/>,content特性的值意味着网页页面选用HTML编码輸出,标识符集为gb2312(简体汉语),国际性化网站开发设计的话,以便标识符统1,提议charset选用utf⑻.

<2>refresh。更新,用于设定多长期内网页页面自身更新1次,或用1段時间全自动自动跳转到别的网页页面,第1种撰写文件格式<meta http-equiv=“refresh” context=“30”/>表明隔30秒更新1次,第2种撰写文件格式<meta http-equiv=“refresh” context=“30;url=www.google.com”/>,表明30秒后网页页面全自动自动跳转到www.google.com网站

<3>expires,汉语意思为“期满”,用于设定网页页面期满時间。1旦网页页面到期,务必到服务器上再次启用网页页面。第1种撰写文件格式为<meta http-equiv=“expires” context=“Wed,10 Mar 2011 12:00:00 GMT”/>,content值意味着网页页面到期的時间,务必应用GMT時间文件格式。第2种撰写文件格式为<meta http-equiv=“expires” context=“30”/>,表明是多少秒后到期。

<4>cache-control,缓存文件操纵。用于严禁在缓存文件中启用网页页面,撰写文件格式为<meta http-equiv=“cache-control” context=“no-cache”/>,no-cache意味着不容许缓存文件。

<5>set-cookie,设定cookie,用于设定本网页页面cookie多久到期,撰写文件格式为<meta http-equiv=“set-cookie” context=“Wed,10 Mar 2011 12:00:00 GMT”/>,意味着到这个時间,cookie将被删掉。


专业知识点3:头顶部信息内容完成与CSS及JavaScript混编

CSS负责HTML网页页面的款式,JaveScript负责HTML网页页面的动态性个人行为。CSS和JaveScript最常见的结合方法是写入头顶部信息内容一部分。
<1>添加CSS只需在头顶部信息内容中添加<style type=“text/css”></style>标识对。案例编码以下

拷贝编码
编码以下:

<html>
<head>
<title>CSS的设定</title>
<style type=“text/css”>
CSS实际內容
</style>
</head>
<body>
</body>
</html>

<2>添加JavaScript只必须在头顶部信息内容中添加<script type=“text/javascript”></script>标识对。案例编码以下:


拷贝编码
编码以下:

<html>
<head>
<title>CSS的设定</title>
<style type=“text/css”>
CSS实际內容
</style>
<script type=“text/javascript”>
JavaScript实际內容
</script>
</head>
<body>
</body>
</html>

专业知识点4:常见头顶部信息内容作用强烈推荐

<1>网页页面切换殊效,在其中1种殊效的撰写文件格式以下:

拷贝编码
编码以下:

<meta http-equiv=“page-enter” content=“blendtrans(duration=0.5)”/>

http-equiv特性的值为page-enter时表进到该网页页面时开启殊效,http-equiv特性的值为page-exit时期表撤出(离去)该网页页面时开启殊效。

Content特性的值意味着殊效的类型,这类殊效也叫动态性滤镜。滤镜类型许多,例如blendtrans便是很普遍得1种,实际效果为淡入淡出,duration值表明实际效果不断的時间(企业为秒)。

另外一种滤镜殊效撰写文件格式以下:


拷贝编码
编码以下:

<meta http-equiv=“page-enter” content=“revealTrans(duration=6)”/>

动态性滤镜revealTrans也能用于网页页面进到与撤出实际效果。Duration表明滤镜殊效不断時间(企业为秒),Transition是滤镜种类,表明想应用哪样殊效,赋值为0~23。

<2>强制性网页页面在当今对话框以单独网页页面显示信息,能够避免网页页面被别的网站架构,撰写文件格式以下:

拷贝编码
编码以下:

<meta http-equiv="window-target" content=“_top">

<3>网页页面标志设定,撰写文件格式以下:

拷贝编码
编码以下:

<link rel="Shortcut Icon" href="/myicon.ico">

href特性的值是ico标志文档的相对路径,这里选用的是相对性根文件目录相对路径