html5中的meta標籤的三要素是什嗎？meta標籤的使用總結

本篇文章主要的為大家講述的是關於html meta標籤的三要素，就是三屬性的組成和使用的介紹，裡面有很多比較重要的屬性值，在網頁中都是很有用的，現在讓我們一起來看這篇文章吧

首先我們要知道meta標籤的三要素是什嗎？

1.必選屬性：content屬性。該屬性是為了定義與http-equiv或者name屬性相關的元資訊，其中的內容是為了便於搜尋機器人尋找資訊和分類使用的。

2. 可選屬性： name屬性該屬性主要用於描述網頁。Name屬性的值可以有：author、description、keyword、generator等等

3.可選屬性：http-equiv屬性。該屬性相當與http的標頭檔作用，可以向瀏覽器返回一些有用的資訊，以協助正確和精確顯示內容。http-equiv屬性的值可以有content-type、expires、refresh等等；

這是這三個屬性群組成了html5 meta標籤的三要素。

現在來看看這些屬性具體的使用介紹：

但是開啟任意的網站，其head標籤內都有一列的meta標籤。

meta常用於定義頁面的說明，關鍵字，最後修改日期，和其它的中繼資料。這些中繼資料將服務於瀏覽器（如何布局或重載頁面），搜尋引擎和其它網路服務。

meta標籤共有兩個屬性，分別是http-equiv屬性和name屬性

HTML5 meta標籤的name屬性：

name屬性主要用於描述網頁，比如網頁的關鍵詞，敘述等。與之對應的屬性值為content，content中的內容是對name填入類型的具體描述，便於搜尋引擎抓取。meta標籤中name屬性文法格式是：

<meta name="參數"content="具體的描述">。

其中name屬性最重要的一個參數。

HTML5 meta標籤的name屬性的值keywords(關鍵字)：

說明：用於告訴搜尋引擎，你網頁的關鍵字。舉例：

<meta name="keywords"content="Lxxyx,部落格，文科生，前端">

HTML5 meta標籤的name屬性的值description(網站內容的描述)：

說明：用於告訴搜尋引擎，你網站的主要內容。舉例：

<meta name="description"content="topic.alibabacloud.com，編程學習的網站，線上視頻教程">

HTML5 meta標籤的name屬性的值author(作者)：

用於標註網頁作者舉例：

<meta name="author"content="topic.alibabacloud.com">

HTML5 meta標籤的http-equiv屬性：

http-equiv顧名思義，相當於http的檔案頭作用。

相當於HTTP的作用，比如說定義些HTTP參數啥的。

meta標籤中http-equiv屬性文法格式是：

<meta http-equiv="參數" content="具體的描述">

其中http-equiv屬性說說其中一個參數：

content-Type(設定網頁字元集)(推薦使用HTML5的方式)

說明：用於設定網頁字元集，便於瀏覽器解析與渲染頁面舉例：

<meta http-equiv="content-Type" content="text/html;charset=utf-8"> //舊的HTML，不推薦

<meta charset="utf-8"> //HTML5設定網頁字元集的方式，推薦使用UTF-8

總結的就這麼多了，meta標籤的自訂屬性實在太多了。所以只去找了常用的一些，還有像 Window-target 這樣已經基本被廢棄的屬性，我也沒有添加。

HTML5 meta標籤的作用：

META標籤是HTML標記HEAD區的一個關鍵標籤，提供文檔字元集、使用語言、作者等基本資料，以及對關鍵詞和網頁等級的設定等，最大的作用是能夠做搜尋引擎最佳化（SEO）。