HTML中rel屬性分析
由于發(fā)現(xiàn)有同學(xué)在微博轉(zhuǎn)播和收藏這篇文章,所以回頭來再審視下這篇隨性翻譯的文章,后來發(fā)現(xiàn)w3cschools.com.cn已經(jīng)有了對(duì)照的中文譯文,所以這里我就繼續(xù)完善下這篇文章吧,讓它顯得更有價(jià)值點(diǎn)。最初想到翻譯這篇文檔源于http://vanessa.b3log.org/research-a-rel-value這篇文章,發(fā)現(xiàn)rel屬性擁有非常多不常見的語義化值,原文著重是想列舉這些屬性值的使用場(chǎng)景,覺得非常有必要通過這樣的方式來了解rel屬性。
示例帶有rel屬性的連接:
<a rel="external" href="http://www.xxoo.com/">ooxx</a>
rel屬性在所有主流瀏覽器都得到了支持
注:瀏覽器渲染時(shí)會(huì)忽略此屬性,然而搜索引擎可以從它獲得更多的信息(a標(biāo)簽僅在href屬性存在時(shí)有效)。
rel屬性指定了當(dāng)前文檔和被連接文檔之間的關(guān)系
語法<a rel="value">
已刪除的值:appendix, chapter, contents, copyright, glossary, index, section, start, subsection。
新的值:archives, author, bookmark, external, first, index, last, license, nofollow, noreferrer, search, sidebar, tag,up。
值 | 描述 | 場(chǎng)景|示例 | HTML4.01 | HTML5 |
---|---|---|---|---|
appendix | 鏈接到文檔的附錄頁(yè) | |||
alternate | 鏈接到一個(gè)備選的源(比如:打印頁(yè), 譯本和鏡像) | head標(biāo)簽內(nèi)配置網(wǎng)站的atom,feed | ||
shortcut icon | 快捷方式 小圖標(biāo) | 指定標(biāo)題欄,地址欄,收藏欄小圖標(biāo) | ||
archives | 鏈接到文檔集或歷史數(shù)據(jù) | <link rel='archives' /> |
||
author | 鏈接到文檔的作者 | head標(biāo)簽內(nèi)申明文檔作者 | ||
canonical | 權(quán)威,典范 |
讓搜索引擎知道當(dāng)前網(wǎng)站中的重復(fù)或相似網(wǎng)頁(yè)中,哪一個(gè)頁(yè)面才是站長(zhǎng)想讓其抓取與收錄的 <link rel="canonical" href="http://xxoo.com/" />
|
||
stylesheet | 文檔的外聯(lián)樣式表 | <link rel="stylesheet" href="base.css"> |
||
home | 連接到站點(diǎn)的主頁(yè) | <link href="http://www.ooxx.com" rel="home" /> |
||
first | 鏈接到集合中的首個(gè)文檔 | <link rel="first" href="index.html"> |
||
start | 鏈接到當(dāng)前文檔的第一頁(yè) | <link rel="start" href="about:blank"> |
||
next | 鏈接到集合中的下一個(gè)文檔 | <link rel="next" href="about:blank"> |
||
prev | 鏈接到集合中的前一個(gè)文檔 | <link rel="chapter" href="about:blank"> |
||
last | 鏈接到集合中最后的文檔 | <link rel="last" href="index.html"> |
||
up | 提供指向一個(gè)文檔的鏈接。該文檔提供當(dāng)前文檔的上下文關(guān)系 | |||
search | 鏈接到文檔的搜索工具 | |||
sidebar | 鏈接到應(yīng)該在瀏覽器邊欄中顯示的文檔 | |||
contents | 鏈接到當(dāng)前文檔的內(nèi)容目錄 | 一般放在文檔主內(nèi)容的側(cè)欄,方便在當(dāng)前頁(yè)面各主題之間跳轉(zhuǎn) | ||
index | 鏈接到當(dāng)前文檔的索引 | |||
glossary | 鏈接到當(dāng)前文檔術(shù)語表 | |||
copyright | 鏈接到當(dāng)前文檔的版權(quán)或隱私頁(yè)面 | 網(wǎng)站底部版權(quán) | ||
chapter | 從當(dāng)前文檔鏈接到一個(gè)章節(jié) | |||
section | 鏈接到文檔列表中的一個(gè)小節(jié) | |||
subsection | 鏈接到當(dāng)前文檔列表中的子小節(jié)。(一個(gè)小節(jié)可擁有多個(gè)子小節(jié)。) | |||
head | 鏈接到集合中的頂級(jí)文檔 | |||
toc | 鏈接到集合的目錄 | |||
parent | 鏈接到源上面的文檔 | |||
child | 鏈接到源下面的文檔 | |||
help | 鏈接到幫助文檔 | <link rel="help" href="http://www.xxoo.net/help.html" /> |
||
bookmark | 用作書簽的永久 URL | 列表標(biāo)題 | ||
external | 鏈接到外部文檔 | 文章中引用到的外部連接 | ||
nofollow | 鏈接到未認(rèn)可的文檔,比如付費(fèi)鏈接 Google 使用 "nofollow" 來規(guī)定其搜索蜘蛛不跟蹤該鏈接 |
站內(nèi)相關(guān)文章,站內(nèi)隨機(jī)文章,評(píng)論回復(fù),列表及文章頁(yè)面中的評(píng)論、瀏覽和作者鏈接,側(cè)邊欄的評(píng)論地址,首頁(yè)導(dǎo)航中的“首頁(yè)”鏈接,評(píng)論最多文章,訪問最多文章 | ||
noreferrer | 規(guī)定當(dāng)用戶跟隨該超鏈接時(shí),瀏覽器不應(yīng)發(fā)送 HTTP referer 頭 | |||
license | 鏈接到文檔的版權(quán)信息 | |||
tag | 當(dāng)前文檔標(biāo)簽(關(guān)鍵詞) | 側(cè)邊欄中的標(biāo)簽云,文章中的標(biāo)簽,列表中的標(biāo)簽,標(biāo)簽頁(yè)面的標(biāo)簽 | ||
friend | 贊助 | 友情鏈接,底部的 themes by |
由于本人水平有限,難免存在一些錯(cuò)誤,看官們?nèi)绻X得有不妥或者需要補(bǔ)充的地方,請(qǐng)留言指出,謝謝!
http://www.w3schools.com/TAGS/att_a_rel.asp
http://vanessa.b3log.org/research-a-rel-value
http://www.w3school.com.cn/htmldom/prop_anchor_rel.asp
不得不提一下的rel-author 標(biāo)簽
HTML rel canonical 屬性值
link標(biāo)簽rel 屬性的含義
關(guān)于 rel="canonical"(google 網(wǎng)站站長(zhǎng)工具)
欄 目:CSS/HTML
下一篇:html用style添加屬性示例
本文標(biāo)題:HTML中rel屬性分析
本文地址:http://mengdiqiu.com.cn/a1/CSS_HTML/9740.html
您可能感興趣的文章
- 04-02好看的字體樣式css,好看的字體樣式圖片
- 04-02html中加入css樣式的簡(jiǎn)單介紹
- 04-02內(nèi)嵌樣式css,內(nèi)嵌樣式表,內(nèi)部樣式表,外部樣式表中優(yōu)先級(jí)最高的
- 04-02vue中的css樣式布局,vue添加css樣式
- 01-10利用iframe在網(wǎng)頁(yè)中顯示天氣附效果截圖
- 01-10通過html為FLASH加鏈接的實(shí)現(xiàn)代碼(div層)
- 01-10a標(biāo)簽中寫有文字如何隱藏文字顯示圖片兼容360模式渲染
- 01-10IE瀏覽器HTML Hack標(biāo)簽總結(jié)
- 01-10html用style添加屬性示例
- 01-10HTML元素設(shè)置焦點(diǎn)的方法


閱讀排行
- 1C語言 while語句的用法詳解
- 2java 實(shí)現(xiàn)簡(jiǎn)單圣誕樹的示例代碼(圣誕
- 3利用C語言實(shí)現(xiàn)“百馬百擔(dān)”問題方法
- 4C語言中計(jì)算正弦的相關(guān)函數(shù)總結(jié)
- 5c語言計(jì)算三角形面積代碼
- 6什么是 WSH(腳本宿主)的詳細(xì)解釋
- 7C++ 中隨機(jī)函數(shù)random函數(shù)的使用方法
- 8正則表達(dá)式匹配各種特殊字符
- 9C語言十進(jìn)制轉(zhuǎn)二進(jìn)制代碼實(shí)例
- 10C語言查找數(shù)組里數(shù)字重復(fù)次數(shù)的方法
本欄相關(guān)
- 04-02表格樣式css樣式,css樣式表單
- 04-02好看的字體樣式css,好看的字體樣式圖
- 04-02分頁(yè)樣式css,分頁(yè)樣式j(luò)q
- 04-02分頁(yè)樣式css,分頁(yè)樣式欄里用來定義首
- 04-02css樣式的引入,css樣式怎么引入
- 04-02css滾動(dòng)條樣式,css滾動(dòng)條的樣式
- 04-02css樣式引入方式有幾種,網(wǎng)頁(yè)引入css樣
- 04-02html中加入css樣式的簡(jiǎn)單介紹
- 04-02vue中的css樣式布局,vue添加css樣式
- 04-02內(nèi)嵌樣式css,內(nèi)嵌樣式表,內(nèi)部樣式表
隨機(jī)閱讀
- 08-05DEDECMS點(diǎn)擊主欄目默認(rèn)顯示第一個(gè)子欄
- 01-10bat批處理徹底隱藏文件的方法(使用
- 01-10C++ 類訪問控制的條件總結(jié)
- 08-05織夢(mèng)dedecms首頁(yè)調(diào)用縮略圖為背景
- 01-10C++實(shí)現(xiàn)將數(shù)組中的值反轉(zhuǎn)
- 08-05dedecms織夢(mèng)模板編輯文檔的同時(shí)自動(dòng)更
- 08-05dedecms織夢(mèng)模板全站調(diào)用收藏?cái)?shù)的方法
- 01-10C語言打印楊輝三角示例匯總
- 01-10vue實(shí)現(xiàn)分頁(yè)加載效果
- 01-11常用的HTML富文本編譯器UEditor、CKEdi