• HTML 的meta用法


    一、语法:

    <meta name="name" content="string"> 以键值对的方式

      name项:常用的选项有Keywords(关键字) ,description(网站内容描述),author(作者),robots(机器人向导)等。

      http- equiv项:可用于代替name项,常用的选项有Expires(期限),Pragma(cache模式),Refresh(刷新),Set- Cookie(cookie设定),Window-target(显示窗口的设定),content-Type(显示字符集的设定)等。

      content项:根据name项或http-equiv项的定义来决定此项填写什么样的字符串。

    二、应用:

    1、告诉浏览器网页所识别的文件类型及语言类型,比如说,我们要让浏览器识别HTM/HTML类型的简体中文网面,我们可以这样写: 
      < Meta http-equiv="Content-Type" content="text/html; charset=gb2312" >

    2、让一些搜索引擎搜索到你的网页,代码可以这样写:
      < Meta Name=" Keywords" Content="网页关键字" > 
      < Meta Name=" description" Content="网页描述文字" > 
    要达到自动搜索引擎真正能方便地搜索到你的网页还得注意以下几点:
    A、 既要定义meta标记项,又要将首页正文的前200个字符定义成反映主页主题的文字。因为有些导航台在标引meta项中的关键词的同时,还要标引正文中的 前200个字符。如:altavista。所以,有些人在注册完导航台后去检查注册结果时,发现导航台中的描述并不是你所希望的,而是诸如版权说明之类的 文字。产生这一现象的原因就是没有注意到这一点。
    B、将定义关键词的meta标记项放在定义描述的meta项之前。如:
      <meta type="keywords" content=".......,...,...">
      <meta type="description" content="...,....,...">
    C、将最重要的关键词放在最前面,让相关的关键词相邻。全小写与首字母大写并存,因为有的导航台在标引时对字符的大小写是敏感的。包括标点符号不要超过250个单词
    D、首页最好不用frame结构,因为frame将屏幕划分成多个窗口后,导航台不能智能地选择正确的窗口中的主页去标引。

    3、让一个页面过上一定的时间,自动转到另一个页面或者站点去,如: 
      < Meta HTTP-EQUIV="refresh" content="6; url=http://www.baidu.com" >
    content中的6表示时间,单位为秒,url=后面是你要转向的网址,若是与你当前网页在同一目录下,可以直接写上文件名,如:
      < Meta HTTP-EQUIV="refresh" content="6; url=page1.htm" >

    4、让网页每隔一段时间刷新一次,若要10秒刷新一次,代码这样写:
    <meta http-equiv="refresh" content="10">

    5、通过Meta可以让你进入页面时产生一些特殊效果,具体应用如下: 
    < meta http-equiv="Page-Enter" content= "revealTrans(Duration=5.0,Transition=n)" > 其中,n的取值范围为0-23,具体的意义如下: 
    0 矩形缩小 1 矩形扩大 2 圆形缩小 
    3 圆形扩大 4 下到上 5 上到下 
    6 左到右 7 右到左 8 竖百叶窗 
    9 横百叶窗 10 错位横百叶窗 11 错位竖百叶窗 
    12 点 13 左右到中间 14 中间到左右 
    15 中间到上下 16 上下到中间 17 右下到左上 
    18 右上到左下 19 左上到右下 20 左下到右上 
    21 横条 22 竖条 23 以上 24种随机选择一种

    6、标注作者:
    <meta name="author" content="黄山村夫—安徽新建基础工程有限责任公司">

    7、控制页面缓冲,如不要页面缓冲的代码这样写:
    <meta http-equiv="Cache-Control" content="no-cache">

    8. 还用用于现在流行的响应式布局控制

    三、常用:

    name属性:

    1、<meta name="Generator" content=" ">用以说明生成工具(如Microsoft FrontPage 4.0)等;

    2、<meta name="KEYWords" content=" ">向搜索引擎说明你的网页的关键词;

    3、<meta name="DEscription" content=" ">告诉搜索引擎你的站点的主要内容;

    4、<meta name="Author" content="你的姓名 ">告诉搜索引擎你的站点的制作的作者;

    5、<meta name="Robots" content="all|none|index|noindex|follow|nofollow "> 
      其中的属性说明如下: 
      设定为all:文件将被检索,且页面上的链接可以被查询; 
      设定为none:文件将不被检索,且页面上的链接不可以被查询; 
      设定为index:文件将被检索; 
      设定为follow:页面上的链接可以被查询; 
      设定为noindex:文件将不被检索,但页面上的链接可以被查询; 
      设定为nofollow:文件将不被检索,页面上的链接可以被查询。

    http-equiv属性
    1、<meta http-equiv="Content-Type" content="text/html " charset=“gb_2312-80" />
    和 <meta http-equiv="Content-Language " content= "zh-CN" /> 
    用以说明主页制作所使用的文字以及语言;又如英文是ISO-8859-1字符集,还有BIG5、utf-8、shift-Jis、Euc、Koi8-2等字符集;

    2、<meta http-equiv="Refresh" content="n;url=http://yourlink" />
    定时让网页在指定的时间n内,跳转到页面http;//yourlink;

    3、<meta http-equiv="Expires" content="Mon,12 May 2001 00:20:00 GMT " />
    可以用于设定网页的到期时间,一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式;

    4、<meta http-equiv="Pragma" content="no-cache " />
    是用于设定禁止浏览器从本地机的缓存中调阅页面内容,设定后一旦离开网页就无法从Cache中再调出;

    5、<meta http-equiv="set-cookie" content="Mon,12 May 2001 00:20:00 GMT " />
    cookie设定,如果网页过期,存盘的cookie将被删除。需要注意的也是必须使用GMT时间格式;

    6、<meta http-equiv="Pics-label" content=" " />
    网页等级评定,在IE的internet选项中有一项内容设置,可以防止浏览一些受限制的网站,而网站的限制级别就是通过meta属性来设置的;

    7、<meta http-equiv="windows-Target" content="_top" />
    强制页面在当前窗口中以独立页面显示,可以防止自己的网页被别人当作一个frame页调用;

    8、<meta http-equiv="Page-Enter" content="revealTrans(duration=10,transtion=50)" /> 
    和 <meta http-equiv="Page-Exit" contect= "revealTrans(duration=20,transtion=6) " />
    设定进入和离开页面时的特殊效果,这个功能即FrontPage中的“格式/网页过渡”,不过所加的页面不能够是一个frame页面。

    参考:http://www.w3school.com.cn/tags/tag_meta.asp

  • 相关阅读:
    python 版本 jaeger-client 导入失败 jaeger-client-python
    kubernetes ingress 重定向地址错误
    win10 多用户登录
    kubernetes监控prometheus配置项解读
    最新版 源码编译 docker
    alpine 容器优化
    kubernetes 中安装 heapster 问题
    github开源文章生成pdf
    jmeter分布式测试
    Cucumber(1)
  • 原文地址:https://www.cnblogs.com/act262/p/3995007.html
Copyright © 2020-2023  润新知