html中meta標簽

meta標簽的作用

meta標簽用于定義頁面的元資訊，可重復出現再頭部標簽中，它是單標簽，通過“名稱/值”的形式成對使用其屬性，
meta標簽主要分為兩大類，一類對頁面進行設定，另一類對搜索引擎進行設定，

對頁面進行設定的格式：<meta http-equiv="名稱" content="值"/>
對搜索引擎進行設定的格式：<meta name="名稱" content="值"/>

http-equiv/content

http-equiv/content屬性對用于設定重繪、失效期、 cookie等頁面資訊，

名稱	值	描述
Refresh	時間值；url地址	用于設定頁面重繪時間和跳轉地址，時間單位是秒，兩個值之間用分號“;”分隔
Expires	到期時間	用于設定網頁的失效期，這個時間必須為GMT時間，即按照“星期日月年時間 GMT”的格式
Set - Cookie	Cookie值；失效期；路徑	用于設定cookie并進行頁面快取，這里失效期仍然為GMT格式，三個引數值之間用分號“；”分隔

用法示例：

頁面停留20秒后跳轉到www.baidu.com
<meta http-equiv="Refresh" content="20;Url=www.baidu.com"/>
網頁于2021年7月26號8點過期
<meta http-equiv ="Expires" content="Thur,26 Jul 2021 08:00:00 GMT"/>
設定cookie并進行頁面快取

<meta http-equiv ="Set-Cookie" content="cookievalue = xxx; expires= Thur,26 Jul 2021 08:00:00 GMT; path=/">

name/content

http-equiv/content屬性對用于設定關鍵字、簡介、作者、機器人向導、著作權、編輯器等，

名稱	值	描述
Author	作者資訊	用于設定作者姓名或相關資訊，多個值之間用逗號“，”分隔，
Description	描述文字	用于設定網頁的描述，搜索引擎會把這個描述文字顯示在搜索結果中，
keywords	關鍵字	用于設定關鍵字，多個關鍵字之間用逗號“；”分隔，
generator	編輯器型別	用于說明網頁是什么編輯器生成的，
revised	修改資訊	用于說明網頁最后修改的人和時間等，多個之間用逗號“，”分隔，

用法示例：

用于標注網頁的作者和Email
<meta name = "Author" Content = "劉明，12345678@qq.com" />
為搜索引擎提供網站簡介
<meta name ="Description" Content ="網站簡介"/>
為搜索引擎提供關鍵字
<meta name="keywords" content="漫步時尚廣場,時尚,購物,影視,餐飲"/>
為搜索引擎提供編輯器型別
<meta name="generator" content="Dreamweaver CC2020"/>
為搜索引擎提供提供最新版本資訊
<meta name="revised" content="David,2021/1/25"/>

charset

charset是HTML5新增的字符編碼屬性，屬性取值必須是標準字符集的名稱，常用的字符編碼如下：

ISO-8859-1：國際標準化組織針對不同的字母表/語言定義的標準字符集（拉丁字母表的字符編碼），是瀏覽器默認的字符集
utf-8：Unicode 聯盟開發的標準，utf-8 是網頁和電子郵件的首選編碼，
gb2312：資訊交換用漢字編碼字符集，中國國家標準總局1980年發布，適用于漢字處理、漢字通信等系統之間的資訊交換，
用法示例：
設定utf-8字符編碼標準
<meta charset=utf-8/>

練習

在Begin - End區域內補充代碼

具體要求：

在之間添加網頁標題的設定，標題文字為“設定元資訊”；
在之間為瀏覽器提供10秒后跳轉至百度首頁https://www.baidu.com/的元資訊；
在之間為瀏覽器設定頁面失效期，失效時間是2021年12月31日8點整；
在之間為搜索引擎設定網頁關鍵詞，關鍵詞分別為“前端”、“元資訊”、“網頁跳轉”、“失效期”、“搜索關鍵詞”，

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <!-- ********* Begin ********* -->




  <!-- ********* End ********* -->
 </head>
 <body>
  <h1 align="center">元資訊的設定</h1>  
 </body> 
</html>

參考答案

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <!-- ********* Begin ********* -->
<title>設定元資訊</title>
	 <meta http-equiv="Refresh" content="10;Url=https://www.baidu.com/"/>
     <meta http-equiv="Expires" content="Fri,31 Dec 2021 08:00:00 GMT"/>
	 <meta name="keywords" content="前端,元資訊,網頁跳轉,失效期,搜索關鍵詞"/>
  <!-- ********* End ********* -->
 </head>
 <body>
  <h1 align="center">元資訊的設定</h1>  
 </body> 
</html>

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/253106.html

標籤：其他

上一篇：vue-baidu-map覆寫層不動態重繪問題

下一篇：一對一直播腳本的開發與應用