<link>标签定义了当前文档与 Web 集合中其他文档的关系。link 元素是一个空元素,它仅包含属性。此元素只能存在于 head 部分,不过它可出现任何次数。在 HTML 中,<link> 标签没有结束标签。在 XHTML 中,<link> 标签必须被正确的关闭。

除了HTML的标准通用属性之外,link元素还包括很多可选属性: charset, href, hreflang, media, rel, rev, target, title和type。这些属性中,target只允许在Transitional和Frameset两种DTD中使用,其它都可在Strict, Transitional和Frameset三种DTD中使用。

这些属性中,rel属性是核心,搜索引擎可以利用该属性获得更多有关链接的信息。

(1)  stylesheet -- 调用外部样式表

该属性是最常用的,用于调用样式表,如下所示:

其中href是目标文档的URL, type则规定了目标URL的MIME类型,而media规定了文档将显示在什么设备上

media: [“screen”:表示显示器设备; "print":表示打印设备;]。

(2)  icon -- 定义网站收藏夹图标

  1. <link rel="shortcut icon" href="http://blog.yunlives.com/images/favicon.ico" type="images/x-icon"/>
  2. <link rel="icon" href="http://blog.yunlives.com/images/favicon.png" type="images/png"/>

icon属性指定标题栏,地址栏,收藏栏小图标

Note: 1. IE只支持ico格式的favicon;  2. rel属性必须包含shortcut, 才会在IE下显示;3.IE下图标必须是.ico格式的,其他浏览器不用

(3) canonical -- 指明网址的规范版本

<link rel="canonical" href="http://blog.yunlives.com?page=3/" />

canonical属性用于让搜索引擎知道当前网站中的重复或相似网页中,哪一个页面才是站长想让其抓取与收录的。

(4) author -- 申明文档作者

(5) home -- 连接到站点的主页

(6)  search -- 链接到文档的搜索工具

(7) sidebar -- 链接到应该在浏览器边栏中显示的文档

(8) friend -- 友情链接

link标签的rel属性的更多相关文章

  1. <link>标签的rel属性全解析

      <link>标签定义了当前文档与 Web 集合中其他文档的关系.link 元素是一个空元素,它仅包含属性.此元素只能存在于 head 部分,不过它可出现任何次数.在 HTML 中,&l ...

  2. link标签中rel属性的作用

    Link标签有两个作用:1. 定义文档与外部资源的关系:2. 是链接样式表.link标签是用于当前文档引用外部文档的 这个标签的rel属性用于设置对象和链接目标间的关系,说白了就是指明你链进来的对象是 ...

  3. 利用link标签的disabed属性大面积的对其他标签元素的CSS样式进行替换操作

    由于平时对元素样式的控制基本上只是3,4个,所以一般用Jquery的时候直接使用$(element).css();这个方法,或者使用$(element).addClass()方法完成样式操作.对于小范 ...

  4. link 标签中“rel=stylesheet”的作用

    最近在复习我的培训项目学子商城项目的时候在引入外部css的时候忘记加上了rel=stylesheet(因为以前看别人给的模板有所以就加了上去,所以并没有太大印象) 那rel=stylesheet到底起 ...

  5. link标签的media属性的用法

    <link rel=stylesheet" type="text/css" href="print.css" media="scree ...

  6. HTML5利用link标签的rel=import引入html页面

    如果是以前,我们可以使用iframe去引入,现在可以是这样的形式:<link rel="import" href="a.html" id="tm ...

  7. 使用<link> 标签定义浏览器标题栏小图标

    使用link标签的rel属性,设置成icon.同时设置href属性值为小图标图片的url. <link rel=" icon " href="image/icon. ...

  8. html 基础之 <link>标签

    实例 链接一个外部样式表: <head> <link rel="stylesheet" type="text/css" href=" ...

  9. 利用link标签rel="alternate stylesheet"属性实现界面动态换肤

    rel="stylesheet"属性指定将一个样式表立即应用到文档.rel="alternate stylesheet"属性将其作为备用样式表而在默认情况下禁用 ...

随机推荐

  1. [AGC016B] Colorful Hats (结论)

    Description 有n个人,每个人都戴着一顶帽子.当然,帽子有不同的颜色. 现在,每个人都告诉你,他看到的所有其他人的帽子共有多少种颜色,请问你有没有符合所有人的描述的情况. Input 第一行 ...

  2. rsync Linux系统下的数据镜像备份工具

    rsync是Linux系统下的数据镜像备份工具,从软件的命名上就可以看出来了——remote sync.rsync支持大多数的类Unix系统,无论是Linux.Solaris还是BSD上都经过了良好的 ...

  3. 虚拟 ​router 原理分析

    上一节我们创建了虚拟路由器“router_100_101”,并通过 ping 验证了 vlan100 和 vlan101 已经连通. 本节将重点分析其中的原理. 首先我们查看控制节点的 linux b ...

  4. 51Nod 1003 1004 1009

    1003 阶乘后面0的数量 基准时间限制:1 秒 空间限制:131072 KB 分值: 5 难度:1级算法题 n的阶乘后面有多少个0? 6的阶乘 = 1*2*3*4*5*6 = 720,720后面有1 ...

  5. [LeetCode] Jump Game II 贪心

    Given an array of non-negative integers, you are initially positioned at the first index of the arra ...

  6. android studio 使用问题总结一

    1,Theme.AppCompat.Light.DarkActionBar 报错 添加v7包 参考其他:http://blog.csdn.net/sanjiaozhen/article/details ...

  7. PHP json_encode 转换成空对象和空数组

    对于以下对象 $foo = array( "bar1" => array(), "bar2" => array() ); 我想转换成 { " ...

  8. vSphere虚拟化ESXI6.0+vclient安装部署

      知识部分:一.什么是vSphere?vSphere是VNware公司在2001年基于云计算推出的一套企业级虚拟化解决方案.核心组件为ESXi.如今,经历了5个版本的改进,已经实现了虚拟化基础架构. ...

  9. 4C 2018 倒数的字符序列

    输入L,N 将长度为L的小写字符串序列,比如L=3,序列为aaa,aab,aac,...aba,...zzz,求倒数第N个字符串序列是什么.输入3 7421 得到pat 第一感觉是A,B,C...,Z ...

  10. USACO 4.1.1 麦香牛块 Beef McNuggets

    题目大意 给你\(n\)个数\(a_1, a_2 ... a_n\), 要你求最大的正整数\(m\)使得方程\(a_1 x_1 + a_2 x_2 + ... + a_n x_n = m\)无非负整数 ...