1. 程式人生 > >HTML meta標籤的使用

HTML meta標籤的使用

介紹:

用來設定元資料, 這些元資料將服務於瀏覽器(如何佈局或過載頁面),搜尋引擎和其它網路服務。

屬性:主要有namehttp-equiv屬性

name的使用

name屬性主要用於描述網頁,比如網頁的關鍵詞,描述等。與之對應的屬性值為content,content中的內容是對name填入屬性名稱的具體描述,便於搜尋引擎抓取。類似於關聯組中鍵和值得關係

keywords(關鍵字)

告訴搜尋引擎,你網頁的關鍵字,每個關鍵字用逗號隔開。

舉例:

<meta name="keywords" content="搜尋,查詢,等等...">

description(網站內容的描述)

用於告訴搜尋引擎,你網站的主要內容。

舉例:

<meta name="description" content="網站的主要內容">

viewport(移動端的視窗)

用於設計移動端響應式網頁設計。在用bootstrap,AmazeUI等框架時候都有用過viewport。

舉例:

<meta name="viewport" content="width=device-width, initial-scale=1">

robots(定義搜尋引擎爬蟲的索引方式)

robots用來告訴爬蟲哪些頁面需要索引,哪些頁面不需要索引。預設是all。

舉例:

<meta name="robots" content="none"> 

具體引數如下:

  • .none : 搜尋引擎將忽略此網頁,等價於noindex,nofollow。
  • noindex : 搜尋引擎不索引此網頁。
  • nofollow: 搜尋引擎不繼續通過此網頁的連結索引搜尋其它的網頁。
  • all : 搜尋引擎將索引此網頁與繼續通過此網頁的連結索引,等價於index,follow。
  • index : 搜尋引擎索引此網頁。
  • follow : 搜尋引擎繼續通過此網頁的連結索引搜尋其它的網頁。

用於標註網頁作者舉例:

<meta name="author"
content="email:[email protected]">

用於標註版權資訊舉例:

<meta name="copyright"content="Lxxyx">

revisit-after(搜尋引擎爬蟲重訪時間)

如果頁面不是經常更新,為了減輕搜尋引擎爬蟲對伺服器帶來的壓力,可以設定一個爬蟲的重訪時間。如果重訪時間過短,爬蟲將按它們定義的預設時間來訪問。

舉例:

<meta name="revisit-after" content="7 days" >

http-equiv的使用

類似於http請求頭資訊:所以,http-equiv 等於請求頭名稱,content 等於請求頭值
舉例:

<meta http-equiv="content-type" content="text/html;charset=utf-8" >

相關推薦

HTML——meta標籤彙總

HTML 裡 meta常用標籤:renderer:<meta name="renderer" content="webkit|ie-comp|ie-stand"> content的取值為webkit,ie-comp,ie-stand之一,區分大小寫。      分

HTML meta標籤小白學習記錄!

META標籤小白學習日記 剛剛接觸HTML,對於其中部分的標籤知識一個剛剛認識的階段,或許會使用很小的一部份,但是,確實遠沒有達到理解的程度。meta就是其中之一。剛剛看見的哦時候完全沒有辦法理解,這東西有什麼用啊!!!頭大。下面展示我的學習成果,知識copy的,外加自己

HTML meta標籤總結與屬性使用介紹

點選開啟連結, 介紹<metaname="viewport"content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />的網址(https://blo

HTML meta標籤的使用

介紹: 用來設定元資料, 這些元資料將服務於瀏覽器(如何佈局或過載頁面),搜尋引擎和其它網路服務。 屬性:主要有name和http-equiv屬性 name的使用 name屬性主要用於描述網頁,比如網頁的關鍵詞,描述等。與之對應的屬性值為c

使用 HTML meta 標籤來禁用快取

如何完美滴使瀏覽器訪問一個 HTML 頁面時禁用快取? 在測試某個 Web應用程式專案時,發現更改後 Chrome 瀏覽器頁面重新整理還是使用之前的版本。經除錯發現 Chrome 預設快取值為 300 秒。 經測試跨瀏覽器禁止快取的 headers 如下: Cache-

htmlmeta標籤

meta標籤的作用。 metadata 中文名叫做元資料,是用於描述資料的資料,他不會顯示在頁面上,但是機器可以識別,常用於定義頁面的說明,關鍵字,最後修改日期,和其他資訊,這些資訊儲存於瀏覽器,如何佈局或者重新載入頁面。搜尋引擎和其他服務。 兩個屬性 http-equiv屬性和name

HTML/CSS——移動端Meta標籤的一些設定

head標籤是html的頭標籤,對於移動端的開發,head標籤裡面有很多我們值得注意的地方。Meta標籤就是屬性設定 <!DOCTYPE html> <html lang = ""&

前端系列教程之HTML(常用meta標籤

<head> <!-- 宣告文件使用的字元編碼 --> <meta charset='utf-8'> <!-- 優先使用 IE 最新版本和 Chrome --> <meta http-equiv="X-UA

HTML:瀏覽模式設定(meta標籤

IE瀏覽器 <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <!--EmulateIE7 模式遵循 <!DOCTYPE> 指令。標準模式以 IE7 標

html中head裡的meta標籤的用法

meta標籤分兩大部分:HTTP-EQUIV和NAME變數。 ●HTTP-EQUIV類似於HTTP的頭部協議,它迴應給瀏覽器一些有用的資訊,以幫助正確和精確 地顯示網頁內容。常用的HTTP-EQUIV型別有: 1.expires(期限) 說明:可以用於設定網頁的到期時間。一旦網頁過期,必須到伺服器上重新調閱

HTML中的meta標籤

常用meta <meta charset='utf-8'> <!--宣告文件使用的字元編碼--> <meta name="description" content="不超過150個字元"/> <!--頁面描述--> &

HTMLmeta標籤的作用與使用

META標籤用來描述一個HTML網頁文件的屬性 META標籤可分為兩大部分:HTTP-EQUIV和NAME變數。 HTTP例項 HTML程式碼例項中有一項內容是 <meta http-eq

HTML常用meta標籤詳細版

<!DOCTYPE html> <!-- 使用 HTML5 doctype,不區分大小寫 --> <!-- 更加標準的 lang 屬性寫法 宣告瀏覽器語言環境 上面這一段表示這是一張中文網頁 常用的lang屬性有 1. 簡體中文頁面:

根據vue-router的meta動態設定html標籤的內容

路由檔案 :router/index.js import Vue from 'vue' import Router from 'vue-router' import index '@/view/i

爬蟲技術 -- 進階學習(十一)【補充】獲取htmlmeta標籤中的content的內容

但是meta標籤中的content內容的抓取,沒有提及到! 上網搜尋了下,發現很少提及,所以寫篇隨筆,備忘一下! 還是在HtmlAgillityPack搭配ScrapySharp的環境下,具體如何配置點選上一篇連結。 例子:<meta name="keywords" content="召開新聞

html頭部meta標籤詳解

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="keywords" content="關鍵詞">

htmlmeta標籤 refresh 屬性值 -- 重新整理與跳轉(重定向)頁面

示例: 5秒之後重新整理本頁面: <metahttp-equiv="refresh" content="5" /> 5秒之後轉到夢之都首頁: <metahttp-equiv="refresh" content="5;url=http://www.dream

html中的meta標籤解讀---讓搜尋引擎更好的找到你

您的個人網站即使做得再精彩,在“浩瀚如海”的網路空間中,也如一葉扁舟不易為人發現,如何推廣個人網站,人們首先想到的方法無外乎以下幾種: ● 在搜尋引擎中登入自己的個人網站 ● 在知名網站加入你個人網站的連結 ● 在論壇中發帖子宣傳你的個人網站 很多人

HTML中的Meta標籤(no-cache)

META標籤,是HTML語言head區的一個輔助性標籤。在幾乎所有的page裡,我們都可以看 到類似下面這段html程式碼: ----------------------------------------------- <head > < meta ht

HTML meta信息含義

scale 文檔 cal 關鍵詞 port con eight ice 渲染 <meta name="viewport" content="width=device-width,initial-scale=1.0"> content屬性值 : widt