關於HTML中rel屬性的分析-html教學-PHP中文網

首頁

web前端

html教學

關於HTML中rel屬性的分析

不言

Jun 20, 2018 am 10:27 AM

html

這篇文章主要介紹了HTML中rel屬性分析,需要的朋友可以參考下

由於發現有同學在微博轉播和收藏這篇文章,所以回頭來再審視下這篇隨性翻譯的文章,後來發現w3cschools.com.cn已經有了對照的中文譯文,所以這裡我就繼續完善下這篇文章吧,讓它顯得更有價值點。最初想到翻譯這篇文件源自於http://vanessa.b3log.org/research-a-rel-value這篇文章,發現rel屬性擁有非常多不常見的語意化值,原文著重是想列舉這些屬性值的使用場景,覺得非常有必要透過這樣的方式來了解rel屬性。

範例

帶有rel屬性的連接:

<a rel="external" href="http://www.xxoo.com/">ooxx</a>

登入後複製

瀏覽器支援

##rel屬性在所有主流瀏覽器都得到了支援

」註:<strong>瀏覽器渲染時會忽略此屬性,然而搜尋引擎可以從它獲得更多的資訊(a標籤僅在href屬性存在時有效)。 </strong>

定義並使用

rel屬性指定了目前文件與被連接文件之間的關係

語法

<a rel="value">

登入後複製

HTML 4.01 與HTML 5 之間的差異

已刪除的值：appendix, chapter, contents, copyright, glossary,

index, section, start, subsection。

新的值：archives, author, bookmark, external, first,

index, last, license, nofollow, noreferrer, search, sidebar, tag,up。

屬性值

#值描述場景|範例HTML4.01HTML5appendix連結到文件的附錄頁 # alternate連結到一個備選的來源(例如:列印頁, 譯本和鏡像)head標籤內配置網站的atom,feed shortcut icon捷徑小圖示#指定標題列,網址列,收藏欄小圖示 archives#連結到文件集或歷史資料 ##home連接到網站的首頁 first連結到集合中的首個文件 #start## 連結到集合中的前一個文件last##連結到集合中最後的文件 # ##連結到應該在瀏覽器側邊欄中顯示的文件 #contents連結到目前文件的內容目錄#一般放在文檔主內容的側邊欄,方便在目前頁面各主題之間跳轉 # index連結到目前文件的索引 glossary連結到目前文件術語表 #copyright連結到目前文件的版權或隱私權頁面 #網站底部版權 #chapter#從目前文件連結到一個章節 section連結到文件清單中的一個小節 # subsection連結到目前文件清單中的子小節。（一個小節可擁有多個子小節。）






				##
		author `連結到文件的作者` head標籤內申明文檔作者 canonical 權威,典範讓搜尋引擎知道目前網站中的重複或相似網頁中，哪一個頁面才是站長想讓其抓取與收錄的 canonical屬性值通常在，rel屬性中出現 #引用網址:http://www.xxoo.com/xhtml/rel_canonical/## ##########canonical從功能上來講，可理解為301永久重定向的輔助功能############canonical可以與相對連結或絕對連結一起使用，但是建議使用絕對連結############Google對canonical的定義是：規範網頁是一組內容高度相似的網頁的首選版本###########canonical：中文"典範"的意思###
#stylesheet	文件的外接樣式表	`#<link rel="stylesheet" href="base.css">`	#


##連結到目前文件的第一頁


			#next	連結到集合中的下一個文件
				prev
			#


			#up	提供指向一個文件的連結。此文件提供目前文件的上下文關係
				#連結到文件的搜索工具
			#sidebar







		`head`##連結到集合中的頂層文件
	toc	#連結到集合的目錄	#
	#parent	連結到來源上面的文件		#
	child ###連結到來源下面的文件###### ###### ############################################## ############help######連結到幫助文件################### ###### ############bookmark######用作書籤的永久URL ######清單標題###### ###### #############external######連結到外部文件######文章中引用到的外部連接###### ###### #############nofollow######連結到未經認可的文檔，例如付費連結###Google 使用"nofollow" 來規定其搜尋蜘蛛不跟踪該鏈接	站內相關文章，站內隨機文章，評論回复，列表及文章頁面中的評論、瀏覽和作者鏈接，側邊欄的評論地址，首頁導航中的“首頁”鏈接，評論最多文章，訪問最多文章		#
noreferrer	#規定當當使用者跟隨該超連結時，瀏覽器不應發送HTTP referer 頭		#
license	連結到文件的版權資訊
tag	目前文件標籤（關鍵字）	側邊欄的標籤雲，文章中的標籤，清單中的標籤，標籤頁的標籤
friend	贊助	友情鏈接，底部的themes by	#