首页 web前端 html教程 <link>标签的rel属性详解

<link>标签的rel属性详解

Jun 27, 2017 pm 01:27 PM
link 标签 详解

<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 -- 调用外部样式表

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

&lt;link rel=&quot;stylesheet&quot; href=&quot;http://blog.yunlives.com/style.css&quot; type=&quot;text/css&quot; media=&quot;screen&quot; /&gt;
登录后复制

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

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

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

&lt;link rel=&quot;shortcut icon&quot; href=&quot;http://blog.yunlives.com/images/favicon.ico&quot; type=&quot;images/x-icon&quot;/&gt;
&lt;link rel=&quot;icon&quot; href=&quot;http://blog.yunlives.com/images/favicon.png&quot; type=&quot;images/png&quot;/&gt;
登录后复制

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

Note: 1. IE只支持ico格式的favicon; 2. rel属性必须包含shortcut, 才会在IE下显示;


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

&lt;link rel=&quot;canonical&quot; href=&quot;http://blog.yunlives.com?page=3/&quot; /&gt;
登录后复制

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


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


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

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

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

(8) friend -- 友情链接


    

参考链接:

http://www.cnblogs.com/aNd1coder/archive/2012/05/30/2526359.html

http://www.dreamdu.com/xhtml/attribute_rel/

http://www.w3school.com.cn/jsref/prop_anchor_rel.asp

以上是<link>标签的rel属性详解的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门文章

两个点博物馆:邦格荒地地点指南
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章

两个点博物馆:邦格荒地地点指南
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章标签

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

Win11管理员权限获取详解 Win11管理员权限获取详解 Mar 08, 2024 pm 03:06 PM

Win11管理员权限获取详解

Oracle SQL中的除法运算详解 Oracle SQL中的除法运算详解 Mar 10, 2024 am 09:51 AM

Oracle SQL中的除法运算详解

如何在Chrome和Edge的所有选项卡中搜索文本 如何在Chrome和Edge的所有选项卡中搜索文本 Feb 19, 2024 am 11:30 AM

如何在Chrome和Edge的所有选项卡中搜索文本

PHP模运算符的作用及用法详解 PHP模运算符的作用及用法详解 Mar 19, 2024 pm 04:33 PM

PHP模运算符的作用及用法详解

linux系统调用system()函数详解 linux系统调用system()函数详解 Feb 22, 2024 pm 08:21 PM

linux系统调用system()函数详解

抖音怎么带标签引流?平台什么标签最容易引流? 抖音怎么带标签引流?平台什么标签最容易引流? Mar 22, 2024 am 10:28 AM

抖音怎么带标签引流?平台什么标签最容易引流?

Linux的curl命令详解 Linux的curl命令详解 Feb 21, 2024 pm 10:33 PM

Linux的curl命令详解

详细解析C语言学习路线 详细解析C语言学习路线 Feb 18, 2024 am 10:38 AM

详细解析C语言学习路线

See all articles