<meta> 標簽是 HTML 中用於描述網頁元信息的元素。它位於 <head> 部分，不會顯示在頁面內容中，但對於瀏覽器、搜索引擎等具有重要作用。主要作用有：定義文檔的字元編碼、提供網頁的描述信息、關鍵詞、作者、視口設置等，這些信息有助於搜索引擎理解和索引網頁內容。 <meta> 標簽的主要屬性有 ...
<meta> 標簽是 HTML 中用於描述網頁元信息的元素。它位於 <head> 部分，不會顯示在頁面內容中，但對於瀏覽器、搜索引擎等具有重要作用。主要作用有：定義文檔的字元編碼、提供網頁的描述信息、關鍵詞、作者、視口設置等，這些信息有助於搜索引擎理解和索引網頁內容。
<meta> 標簽的主要屬性有：
1. charset ：定義文檔的字元編碼，如 UTF-8。例如： <meta charset="UTF-8">
2. name ：定義元信息的名稱，與 content 屬性配合使用。常見的 name 屬性值有：description（網頁描述）、keywords（關鍵詞）、author（作者）、viewport（視口設置）。例如：
- 描述信息： <meta name="description" content="這是一個關於HTML的教程。">
- 關鍵詞： <meta name="keywords" content="HTML, CSS, JavaScript, Web開發">
- 作者： <meta name="author" content="張三">
- 視口設置： <meta name="viewport" content="width=device-width, initial-scale=1.0">
3. http-equiv ：定義 HTTP 頭部的元信息，如：Content-Type（內容類型）、X-UA-Compatible（瀏覽器相容性）、refresh（自動刷新）。例如：
- 內容類型： <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- 瀏覽器相容性： <meta http-equiv="X-UA-Compatible" content="IE=edge">
- 自動刷新（每隔 5 秒刷新一次）： <meta http-equiv="refresh" content="5">
註意，由於 <meta> 標簽沒有內容，所以不需要閉合標簽。不同的屬性可以搭配使用，以提供更多信息。
除了之前提到的屬性外，還有一些不太常用但可能有用的 <meta> 屬性和應用場景：
1. robots：指定搜索引擎爬蟲如何處理頁面。例如：
<meta name="robots" content="noindex, nofollow">
上面的示例表示告訴搜索引擎爬蟲不要索引該頁面，也不要沿著該頁面的鏈接繼續爬行。
2. theme-color：定義瀏覽器地址欄的顏色，僅在支持的移動設備上有效。例如：
<meta name="theme-color" content=" 336699">
3. application-name：定義網頁在啟用 Web 應用時的名稱。例如：
<meta name="application-name" content="Web應用">
4. generator：指定生成該網頁的軟體名稱。例如：
<meta name="generator" content="Meta6.0">
5. language：定義網頁內容的主要語言。例如：
<meta name="language" content="zh-CN">
6. expires：設定網頁過期時間，過期後瀏覽器將從伺服器重新請求。例如：
<meta http-equiv="expires" content="Wed, 21 June 2023 09:18:54 GMT">
7. pragma：禁止瀏覽器從本地電腦的緩存中訪問頁面內容。例如：
<meta http-equiv="pragma" content="no-cache">
8. Cache-Control：指定瀏覽器如何緩存頁面。例如：
<meta http-equiv="Cache-Control" content="no-cache">
9. Cproperty：用於指定 Open Graph 元數據。例如：
<head> <meta property="og:title" content="頁面標題"> <meta property="og:description" content="頁面描述"> <meta property="og:image" content="頁面圖片 URL"> <!-- Open Graph 是一種開放的元數據協議，用於向社交媒體平臺提供有關頁面內容的更多信息。 --> <!-- 使用 Open Graph 元數據可以在頁面被分享到社交媒體平臺時，自動生成高質量的預覽圖像、標題和描述，從而提高分享的可讀性和吸引力。 --> </head>
這些屬性在特定的應用場景下可能有用，但並非在所有網頁中都需要使用。根據實際需求和目標選擇合適的屬性來配置 <meta> 標簽。
