举例讲解HTML中META标签的一些使用技巧

所属分类: 网页制作 / HTML/Xhtml 阅读数: 880
收藏 0 赞 0 分享

HTML meta 标签

HTML meta 标签可以用来提供网页内容的信息给浏览器或是搜寻引擎,例如网页内容的描述、网页重要关键字、网页编码等都是常用 meta 来标示的网页信息,另外还有网页作者、网页发布时间、所使用的编辑器等较不重要的信息,也可以透过 META TAG 来标示,META 的功能仅是用来注明这些网页信息,且提供给浏览器或是搜寻引擎,并非是要给写给浏览网页的"人"看的内容。

HTML meta 标签写在 head 范例

XML/HTML Code复制内容到剪贴板
  1. <head>  
  2. <title>测试网页</title>  
  3. <meta name="description" content="这里是网页的简短描述">  
  4. <meta name="keywords" content="关键字 1,关键字 2">  
  5. </head>   

标准的 <meta> 标签没有结尾,直接将参数写在 <meta> 内即可,一个网页内可以有很多个不同的 <meta> 标签,全部都要写在 head 标签内,范例中的 title 标签是用来标示网页标题用的,可以写在 <meta> 标签之前,也可以写在 <meta> 标签之后。

一、显示及排列中文

XML/HTML Code复制内容到剪贴板
  1. <META http-equiv="Content-Type" content="text/html; charset=big5">  

说明:
Content-Type==>文件内容格式
;==>CONTENT内要作的每件事" ",分别以分号区隔
text/html==>纯文字/超文字
charset==>字符组为中文繁体大五码,如用iso-2022-jp是指日文


二、让搜索引擎容易找到您

XML/HTML Code复制内容到剪贴板
  1. <META NAME="KeyWords" CONTENT="计算机教学'网络教学'Linux教学'CSS教学'HTML教学'软件教学'发信教学'SEO教学'交换连结">  
  2. <META NAME="KeyWords" CONTENT="css'HomePage'html'linux'seo">  

说明:网页内文关键字,可使用中、英文均可


三、关于网站的内容描述

XML/HTML Code复制内容到剪贴板
  1. <META NAME="Description" CONTENT="这是一个免费学习网页制作的好地方,网络研究所">  

说明:Description==>内容的主要描述


四、这个网页的作者是谁

XML/HTML Code复制内容到剪贴板
  1. <META NAME="Author" CONTENT="PCNET">  

说明:标注本网页作者姓名等资料


五、这是用何编辑器完成的网页

XML/HTML Code复制内容到剪贴板
  1. <META NAME="Generator" CONTENT="Mozilla/3.0Gold(Win95)[Netscape]">  

说明:
标注本网页作者姓名等资料
Generator==>编辑器
Mozilla/3.0Gold(Win95)[Netscape]==>编辑器等版本说明


六、这个网页何时完成

XML/HTML Code复制内容到剪贴板
  1. <META NAME="Creation-Date" CONTENT="01-jan-2003 20:40:01">  

说明:
Creation-Date==>创作日期
01-jan-2003 20:40:01==>详细日期时间


七、这个网页有效时期及不被Cache所限制

XML/HTML Code复制内容到剪贴板
  1. <META NAME="Expired" CONTENT="01-jan-2005 00:00:00">  
  2. <META HTTP-EQUIV="Pragma" CONTENT="no_cache">  

说明:
Expired==>网页终止期限
01-jan-2005 00:00:00==>已过去的日期时间,也可以用Mon,12 Jan 2007 00:00:00 GMT
no_cache==>不被Cache所限制,也就是网页没有记忆功能。


八、网页作者的网址与信箱

XML/HTML Code复制内容到剪贴板
  1. <link rev="made" href="mailto:pcnettw@yahoo.com.tw">  
  2. <link rev="made" href="http://www.pcnet.idv.tw/">  

说明:网页作者信箱或网址陈述
rev==>正向关联
made=>网页制造者
href==>您的信箱或网址


九、使网页能自动换页

XML/HTML Code复制内容到剪贴板
  1. <META HTTP-EQUIV="refresh" CONTENT="15; url=http://www.pcnet.idv.tw/">  

说明:
refresh==>更新或重整
15==>15秒后执行下一动作
;==>CONTENT内要作的每件事" ",分别以分号区隔
url=http://www.pcnet.idv.tw/==>指定转换到此网页


十、进入或离开的特效(限IE使用)

XML/HTML Code复制内容到剪贴板
  1. <META http-equiv="指定要换页特效发生的状况" content="特效模式(Duration=特效持续时间,Transition=代替的特效)">  

说明:
http-equiv="Page-Enter是进入本页、Page-Exit是离开本页、Site-Enter是进入本站、Site-Exit是离开本站"。
content="revealTrans(指定换页特效)、blendTrans(设定换页特效为"混合")。
Duration=设定特效持续的时间(秒),建议在3-5秒之间。
Transition=以0-23代替特效(略)。


注:

它必须放于<HEAD>与</HEAD>之间,主要用于本网页的内容说明,以利自己或别人(搜索引擎)使用,另外也可以制造出一些自动翻页等特殊效果。
http-equiv或NAME属性,必须配合content属性使用,两者也可互替使用。
后设语法标签(META description tag)的用法随各搜索引擎设定有所不同。
有无Meta标签,并不影响网页正常显示,其最大目的在于提供网页各种信息及产生特殊效果。
网页运用,建议以本页所述1.2.3.4.8项这些标签为主,其余视况自行增减。
您可使用检视原始码,来看本例实际安排。
更多的报导资料,欢迎莅临讲师(作者)网站查看。

更多精彩内容其他人还在看

XHTML入门学习教程:XHTML超级链接

超级链接<a>标签 毫不夸张的说,是超级链接把整个互联网连接了起来。超级链接几乎可以指向互联网上的任何资源,例如另外一个网页、一张图片、一首MP3歌曲等等。而利用XHTML建立超级链接的语法却非常简单,只需要一对<a></a>标签即可:
收藏 0 赞 0 分享

网页制作解惑:图象文件的路径

本文属于网页教学网闪电儿原创,转载可以去掉这句话,但是不要以任何借口或方式更改文章的内容,否则后果自负!转载请注明作者和出处。 很久以前一直到现在,有好多网友问过我类似的问题,尤其是拷贝了本站的一些图形图像特效代码后,总是图片显示不出来等问题出现,在这
收藏 0 赞 0 分享

HTML教程,简单学习HTML语言

1、<body background=图片文件名 bgcolor=颜色 text=颜色 link=颜色 vlink=颜色 alink=颜色>...</body>标记属性: background:设置网页的背景图像。bgcolor:设置网页的背景颜色。
收藏 0 赞 0 分享

HTML基础:HTML的基本结构

HTML的基本结构   超文本文档分文档头和文档体两部分,在文档头里,对这个文档进行了一些必要的定义,文档体中才是要显示的各种文档信息。 <HTML>    <HEAD>       头 部 信 息    </HEAD>
收藏 0 赞 0 分享

HTML教程,认识optgroup元素

select的分类选择,经测试IE和FF都能很好的支持该元素 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 S
收藏 0 赞 0 分享

网页输入框的样式触发效果

  这个例子主要学习两个参数onblur和onFocus.因为这两个参数以前很少遇到,baidu 一下明白了,onblur 是控件在失去焦点的时候触发的事件,而onFocus就是成为输入焦点的时候触发的事件,这两个参数都可以和className结合直接调用样式表类名
收藏 0 赞 0 分享

HTML教程,HTML默认样式

html, address, blockquote, body, dd, div, dl, dt, fieldset, form, frame, frameset, h1, h2, h3, h4,
收藏 0 赞 0 分享

超链接打开目标(target)的测试

链接的target属性决定了链接在哪边打开,它的值通常为以下五种:_blank、_self、_parent、_top和自定义,依次表示为:新窗口、当前窗口、父窗口、顶层窗口和框架。当所指名称的框架不存在时,自定义作用等同于_blank。今天我们主要测试一下当所指名称的框架处于不同
收藏 0 赞 0 分享

HTML优化加快网页速度

明显HTML,暗渡“公用脚本” 减少web页面下载时间的关键就是设法减小文件大小。当多个页面共用一些成分内容时,就可以考虑将这些公用部分单独分离出来。比如:我们可以将多个HTML页面都用到的脚本程序编写成独立存在的.js文件,然后再在页面中按如下
收藏 0 赞 0 分享

XHTML教程,简单认识XHTML基础知识

  本文简单让大家认识一下XHTML,了解XHTML的基础知识 什么是XHTML   XHTML是The Extensible HyperText Markup Language(可扩展标识语言)的缩写。HTML是一种基本的WEB网页设计语言,XHTML是一个基于XM
收藏 0 赞 0 分享
查看更多