13、HTML <meta>标签
<meta> 標簽內的信息不會顯示在頁面中,定義<meta> 標簽的主要目的是因為它對機器是可讀的。
<meta> 標簽有很多功能,它可以定義文檔中的關鍵字,也可以對文檔進行描述,還可以配合自身的屬性設置網頁的過期時間等等。
當我們定義了頁面的關鍵字或者描述信息后,搜索引擎蜘蛛(也就是常說的網絡爬蟲)就可以利用它們來搜索這個頁面的信息。
下面來看一下 <meta> 標簽的常用屬性:
1. name屬性
name 屬性可以用來定義網頁的關鍵字、描述、作者以及版權信息等等。我們來看一下它的常用屬性值:
name 常見屬性值:
- keywords---- 用來定義網頁的關鍵字。關鍵字可以是多個,之間需要用英文逗號,隔開。
- description---- 用來定義網頁的描述。
- author---- 用來定義網頁的作者。
- copyright---- 用來定義網頁的版權信息。
當 name 屬性規定好這些信息后,后面還需緊跟 content 屬性設置具體的內容,這樣才可以生效。具體使用語法如下:
<meta name="keywords" content="<head>標簽描述"> <meta name="description" content="這篇文章主要對<head>標簽進行詳細講解"> <meta name="author" content="author"> <meta name="copyright" content="本站所有教程均為原創,版權所有,禁止轉載。否則將追究法律責任。">2. charset屬性
charset 是 HTML 5 中的新屬性,用來定義頁面的編碼格式。它的常用屬性值見下表:
charset 常用屬性值:
- ISO-8859-1---- 表示網頁的默認編碼格式。
- UTF-8---- 表示萬國碼,是目前最常用的編碼格式。
- gb2312 ----表示國際漢字碼,不包含繁體。
- gbk---- 表示國家標準擴展版。增加了繁體,包含所有亞洲字符集。
具體代碼如下所示:
<head><meta charset="UTF-8"><meta charset="gb2312"><meta charset="ISO-8859-1"><meta charset="gbk"> </head>以上為語法演示,在使用時根據需求,只使用其中一個即可。
3. http-equiv屬性
所有主流瀏覽器都支持 http-equiv 屬性。它可以設置網頁的過期時間,自動刷新等,有以下幾個常用屬性值:
http-equiv 常用屬性值:
- expires ----設置網頁的過期時間。
- refresh ----設置網頁自動刷新的時間間隔,單位是秒。
- content-type ----定義文件的類型,用來告訴瀏覽器該以什么格式和編碼來解析此文件。
我們通過一段簡單的代碼來看一下如何使用:
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta http-equiv="content-type" content="text/html"><meta http-equiv="expires" content="Dec 20 2090"><meta http-equiv="refresh" content="1000"><title>Document</title> </head> <body> </body> </html>上面使用了 <meta> 的幾個常用屬性,我們來看一下:
- <meta charset="UTF-8"> 設置了網頁的編碼格式為 utf-8;
- <meta http-equiv="content-type" content="text/html"> 用來告訴瀏覽器本網頁編寫的是HTML 代碼,需要用 HTML 的格式來進行解析。在下面會附上 content-type 常用文件類型值講解;
- <meta http-equiv="expires" content="Dec 20 2090"> 定義網頁于 2090 年 12 月20 日過期;
- <meta http-equiv="refresh" content="1000"> 設置了頁面每隔 1000 秒就會進行一次刷新。
我們可以看出,http-equiv 屬性和 name 屬性一般與 content 屬性配合使用,有點類似固定搭配。以上只是 <meta> 標簽常用的屬性,實際上它的屬性遠遠不止這些,但是到目前為止,我們只需會用上面講過的這幾個屬性即可。
4. content-type常用屬性值
上面我們提到了 content-type 用來定義文件的類型,在此處為讀者附上 content-type 常用文件類型值(只做了解):
content-type 常用文件類型值:
- text/html---- 表示該文檔是 HTML 格式的文檔。
- text/plain---- 表示該文檔是純文本格式的文檔。
- text/xml---- 表示該文檔是 XML 格式的文檔。
- image/gif---- 表示該文檔是 gif 圖片格式的文檔。
- image/jpeg---- 表示該文檔是 jpg 圖片格式的文檔。
- image/png ----表示該文檔是 png 圖片格式的文檔。
總結
以上是生活随笔為你收集整理的13、HTML <meta>标签的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 12、HTML <form>标签(表单)
- 下一篇: 14、HTML <input>标签