<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. wsl折腾记

    参考1 wsl在哪 C:\Users\用户名\AppData\Local\Packages\CanonicalGroupLimited.Ubuntu18.04onWindows_79rhkp1fndg ...

  2. bzoj 3277 串 后缀树+子树不同数个数

    题目大意 给定\(n\)个字符串和\(k\) 对于每个字符串,输出它有多少个子串至少是\(k\)个字符串的子串(包括自己) 分析 建出广义后缀自动机 至少是\(k\)个字符串的子串就是求子树内不同数个 ...

  3. [LeetCode] Factorial Trailing Zeroes 阶乘末尾0

    Given an integer n, return the number of trailing zeroes in n!. Note: Your solution should be in log ...

  4. iOS 判断来电状态CTCallCenter代码块不执行问题的解决

    项目中需要检测来电状态,使用了CTCallCenter,在AppDelegate中,代码如下: 
 CTCallCenter *callCenter = [[CTCallCenter alloc] i ...

  5. python fromkeys的坑

    有个不定长的列表,想把列表中的每个值当做字典的key, 初始值为空列表,于是想到了fromkeys这个方法 In [337]: l = ['a','b','c'] In [338]: res = di ...

  6. C#byte怎么转成图片

    这个其实很简单我给大家提供一个方法吧 /// <summary> /// 字节数组生成图片 /// </summary> /// <param name="By ...

  7. Linux centos 时间不同步 date 和 hwclock 时间不一致

    Linux centos 时间不同步 date 和 hwclock 网站有两台服务器,date 查看差3分钟 在应用 APP倒计时 与 直播,时时性较强的功能应用中 请求服务器后返回的服务器时间与数据 ...

  8. ASP.NET MVC 利用Razor引擎生成静态页

    实现原理及步骤: 1.通过ViewEngines.Engines.FindView查找到对应的视图,如果是部分视图,则用:ViewEngines.Engines.FindPartialView: 2. ...

  9. 4C 2018 福到了

    输入字符c(只含有@和空格).数字n.规模n*n的二维字符矩阵. 若倒过来的数组和原数组一样形式输出提示. 最后输出以字符c替换的字符数组. #include <bits/stdc++.h> ...

  10. 立即执行函数(IIFE)

    立即执行函数(IIFE) 看到这里,相信你一定迫不及待地想知道究竟如何做了吧,其实很简单,只需要用括号全部括起来即可,比如下面这样: (function(){ /* code */ }()); 为什么 ...