您好,登錄后才能下訂單哦!
這篇文章主要講解了“html5的頭部標記怎么使用”,文中的講解內容簡單清晰,易于學習與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學習“html5的頭部標記怎么使用”吧!
html5的頭部標記有:1、“<head>”;2、“<title>”;3、“<base>”;4、“<link>”;5、“<style>”;6、“<meta>”;7、“<script>”;8、“<noscript>”。
本教程操作環境:windows7系統、HTML5版、Dell G3電腦。
1、<head>標簽
<head> 標簽是所有頭部標簽的容器,這些頭部標簽用來定義有關 HTML 文檔的元數據(描述數據的數據)以及所需資源的引用(例如 CSS 樣式文件、JavaScript 腳本文件),對文檔能夠在瀏覽器中正確顯示起到了非常重要的作用。根據我們的需求,可以在 HTML 頭部定義大量的元數據,也可以定義很少或者根本就不定義。雖然頭部標簽是 HTML 文檔的一部分,但其中的內容并不會顯示在瀏覽器中。
<head> .... </head>
2、<title> 標簽
<title> 標簽用來定義 HTML 文檔的標題,只有包含 <title> 標簽的文檔才算是一個有效的 HTML 文檔。另外,一個 HTML 文檔中僅允許存在一個 <title> 標簽,并且 <title> 標簽必須放置在 <head> 標簽中。
注意,在 <title> 標簽內部僅允許包含純文本內容,不能包含其他 HTML 標簽。
<title> 標簽的主要作用如下所示:
在瀏覽器標題欄或者任務欄中顯示標題;
當將頁面添加到收藏夾(書簽)時提供標題;
在搜索結果中顯示頁面標題。
下面的示例演示了如何在 HTML 文檔中使用 <title> 標簽:
<head> <meta charset="utf-8"> <title>億速云-教程_手冊_視頻-免費php在線學習平臺</title> </head>
<title> 標簽的內容必須與當前文檔有關,并且不應該過長,中文頁面請盡量控制在 30 個字符(包括空格)以內。
3、<base> 標簽
<base> 標簽用于為頁面中所有相對鏈接指定一個基本鏈接,當您設置了基本鏈接后,當前頁面中的所有相對鏈接都會使用這個基本鏈接作為前綴,如下例所示:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title><base>標簽演示</title> <base href="http://www.neiyidaogou.com/"> </head> <body> <ul> <li><a href="course.html">視頻教程</a></li> <li><a href="course/type/3.html">入門教程</a></li> </ul> </body> </html>
上面的示例中第一個 <li> 標簽中的超鏈接會被解析為“http://www.neiyidaogou.com/course.html”,第二個 <li> 中的超鏈接會被解析為“http://www.neiyidaogou.com/course/type/3.html”。
注意,HTML 文檔中的 <base> 標簽必須出現在任何引用外部資源的標簽之前,而且一個 HTML 文檔中僅允許定義一個 <base> 標簽。
4、<link> 標簽
<link> 標簽經常用于引用外部 CSS 樣式表,<link> 標簽中包含兩個主要的屬性,分別是 rel 和 href。rel 屬性用來指示引用文件的類型,href 屬性用來設置外部文件的路徑。示例代碼如下:
<head> <title>此處書寫標題</title> <link rel="stylesheet" href="common.css"> </head>
HTML <head> 標簽中可以包含任意數量的 <link> 標簽。
5、<style>標簽
使用 <style> 標簽可以在 HTML 文檔中嵌入 CSS 樣式,需要注意的是在 <style> 標簽中定義的樣式僅對當前 HTML 文檔有效。示例代碼如下:
<head> <title>此處書寫標題</title> <style> body { background-color: YellowGreen; } h2 { color: red; } p { color: green; } </style> </head>
注意:對于文檔中的唯一樣式可以使用 <style> 標簽,但對于在多個文檔中通用的樣式,使用外部樣式表更為合適。關于在 HTML 中嵌入 CSS 的更多內容,請轉到《HTML嵌入CSS樣式(四種方法)》。
6、<meta> 標簽
<meta> 標簽用于提供有關 HTML 文檔的元數據,例如頁面有效期、頁面作者、關鍵字列表、頁面描述等信息。<meta> 標簽定義的數據并不會顯示在頁面上,但卻會被瀏覽器解析。
1) 定義字符集
<meta charset="UTF-8">
charset 屬性用來指定 HTML 文檔的字符編碼,上面的示例中,我們將文檔的字符編碼設置為了“UTF-8”。
2) 定義頁面描述
<meta name="description" content="億速云提供大量免費、原創、高清的php視頻教程,并定期舉行公益php培訓!可邊學習邊在線修改示例代碼,查看執行效果!php從入門到精通,一站式php自學平臺!">
定義頁面的描述信息有利于搜索引擎的搜索。
<title> 標簽定義文檔標題,name="description" 定義文檔描述,描述的長度通常大于標題。
3) 定義關鍵字
<meta name="keywords" content="php教程,php入門教程,php視頻教程,php源碼下載,php手冊">
關鍵字用于為搜索引擎提供與頁面有關的信息。
4) 定義頁面作者
<meta name="author" content="億速云">
通過某些內容管理系統可以自動提取作者信息。
5) 刷新頁面
<meta http-equiv="refresh" content="30">
上例中的代碼用于向瀏覽器發送一個指令,使瀏覽器在經過指定的時間間隔(30 秒)后自動刷新頁面。在 content 屬性中除了可以指定時間間隔外,還可以再指定一個鏈接,這時頁面將在指定的時間后重定向到鏈接所指向的頁面,如下例所示:
<meta http-equiv="refresh" content="10; url=http://www.neiyidaogou.com/">
7、<script> 標簽
<script> 標簽用于定義 JavaScript 腳本,示例代碼如下:
<head> <title>億速云</title> <script> document.write("億速云") </script> </head>
8、<noscript> 標簽
當用戶的瀏覽器不支持 JavaScript 腳本或者禁用 JavaScript 腳本時,可以在 <noscript> 標簽中定義一些內容來替代不能運行的 JavaScript 腳本或者給用戶一些提示。除了 <script> 標簽外,在 <noscript> 標簽中可以包含任何 HTML 元素,如下例所示:
<head> <title>億速云</title> <noscript> <p>您的瀏覽器不支持 JavaScript 或者您禁用了 JavaScript,請<a href="http://www.neiyidaogou.com/">點擊這里</a>了解如何啟用 JavaScript。</p> </noscript> </head>
感謝各位的閱讀,以上就是“html5的頭部標記怎么使用”的內容了,經過本文的學習后,相信大家對html5的頭部標記怎么使用這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是億速云,小編將為大家推送更多相關知識點的文章,歡迎關注!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。