摘要:常用于定義頁面的說明,關鍵字,最后修改日期,和其它的元數據。這些元數據將服務于瀏覽器如何布局或重載頁面,搜索引擎和其它網絡服務。安全措施緩存所有響應,但并非必須。另一種是通過網頁的標簽。該元數據名稱與屬性包含的值相關聯。
簡介文章同步于Github Pines-Cheng/blog
meta標簽是HTML語言HEAD區的一個輔助性標簽。
meta常用于定義頁面的說明,關鍵字,最后修改日期,和其它的元數據。這些元數據將服務于瀏覽器(如何布局或重載頁面),搜索引擎和其它網絡服務。
mata 標簽包含全局屬性
charset聲明網頁的字符編碼:
contentcontent屬性的內容是htp-equiv或name屬性的值,具體取決于你用哪一個。
http-equiv該屬性可以包含HTTP頭的名稱,屬性的英文全稱為http-equivalent。它定義了可以改變server和user-agent行為的指令。該指令的值在content屬性內定義,可以是以下之一:
content-language(已過時)定義頁面的默認語言。它可以被任何元素上的lang屬性所覆蓋。
Pragma禁止瀏覽器從本地計算機的緩存中訪問頁面內容。如:
<meta http-equiv="Pragma" content="no-cache">expires
可以用于設定網頁的到期時間。一旦網頁過期,必須到服務器上重新傳輸。
cache-control指定請求和響應遵循的緩存機制。共有以下幾種用法:
no-cache: 先發送請求,與服務器確認該資源是否被更改,如果未被更改,則使用緩存。
no-store: 不允許緩存,每次都要去服務器上,下載完整的響應。(安全措施)
public : 緩存所有響應,但并非必須。因為max-age也可以做到相同效果
private : 只為單個用戶緩存,因此不允許任何中繼進行緩存。(比如說CDN就不允許緩存private的響應)
max-age : 表示當前請求開始,該響應在多久內能被緩存和重用,而不去服務器重新請求。例如:max-age=60表示響應可以再緩存和重用 60 秒。
content-security-policy允許頁面作者定義當前頁面的內容策略。內容策略主要指定允許的服務器地址和腳本端點,這有助于防止cross-site scripting 攻擊。
CSP 的實質就是白名單制度,開發者明確告訴客戶端,哪些外部資源可以加載和執行,等同于提供白名單。它的實現和執行全部由瀏覽器完成,開發者只需提供配置。
CSP 大大增強了網頁的安全性。攻擊者即使發現了漏洞,也沒法注入腳本,除非還控制了一臺列入了白名單的可信主機。
兩種方法可以啟用 CSP。一種是通過 HTTP 頭信息的Content-Security-Policy的字段。
Content-Security-Policy: script-src "self"; object-src "none"; style-src cdn.example.org third-party.org; child-src https:
另一種是通過網頁的標簽。
上面代碼中,CSP 做了如下配置:
腳本:只信任當前域名
樣式表:只信任cdn.example.org和third-party.org
框架(frame):必須使用HTTPS協議加載
其他資源:沒有限制
啟用后,不符合 CSP 的外部資源就會被阻止加載。
更多介紹可見:Content Security Policy 入門教程
content-type(已過時)定義文檔的MIME類型,后跟其字符編碼。
不要使用這個值,因為它已經過時了。推薦使用元素上的charset屬性。
由于無法在XHTML或HTML5的XHTML序列化中更改文檔類型,因此不要使用將MIME類型設置為XHTML MIME類型。
refresh該指令指定:
如果content屬性只包含一個正整數,則表示該頁面重新加載的秒數。
如果content屬性包含一個正整數,后跟字符串"; url =",那么表示當前頁面XX秒后重定向到另一個有效的URL。
//意思是2秒后跳轉到githubset-cookie(已過時)
定義頁面的cookie,對應的content值必須遵循IETF HTTP Cookie Specification
不要使用這條指令,使用HTTP頭的Set-Cookie替代
X-UA-Compatible用于告知瀏覽器以何種版本來渲染頁面。
//指定IE和Chrome使用最新版本渲染當前頁面name
name屬性的定義是屬于document-level metadata,不能和以下屬性同時設置: itemprop, http-equiv 或 charset。
該元數據名稱與content屬性包含的值相關聯。 name屬性的可能值為:
application-name定義在網頁中運行的應用程序的名稱。
author用于標注網頁作者。
description包括一個關于頁面內容的縮略而精準的描述。一些瀏覽器,如Firefox和Opera,會使用這個當做網頁書簽的默認描述。
generator用于標明網頁是什么軟件做的。
keywords用于告訴搜索引擎,你網頁的關鍵字
revisit-after如果頁面不是經常更新,為了減輕搜索引擎爬蟲對服務器帶來的壓力,可以設置一個爬蟲的重訪時間。如果重訪時間過短,爬蟲將按它們定義的默認時間來訪問。舉例:
rendererrenderer是為雙核瀏覽器準備的,用于指定雙核瀏覽器默認以何種方式渲染頁面。比如說360瀏覽器。舉例:
//默認webkit內核 //默認IE兼容模式 //默認IE標準模式referrer
referrer 控制document發起的Request請求中附加的Referer HTTP header,相應的值在content中:
content | 含義 |
---|---|
no-referrer | 不發送HTTP Referer頭 |
origin | 發送document的origin |
no-referrer-when-downgrade | 將origin作為referer發送到和當前頁面同等安全的URLs(https-> https),但不會將origin發送到不安全的URLS(https-> http)。這是默認行為。 |
origin-when-crossorigin | same-origin的請求,發送的完整URL(剝離參數),但在其他情況下只發送origin |
unsafe-URL | same-origin 或 cross-origin的請求,將發送完整的URL(剝離參數) |
robots用來告訴爬蟲哪些頁面需要索引,哪些頁面不需要索引。
值 | 描述 | Used By |
---|---|---|
index | 允許robot索引本頁面(默認) | All |
noindex | 不允許robot索引本頁面 | All |
follow | 允許搜索引擎繼續通過此網頁的鏈接索引搜索其它的網頁(默認) | All |
nofollow | 搜索引擎不繼續通過此網頁的鏈接索引搜索其它的網頁 | All |
none | 相當于noindex,nofollow | |
noodp | 禁止使用Open Directory Project描述(如果有的話)作為搜索引擎結果中的頁面描述。 | Google, Yahoo, Bing |
noarchive | 要求搜索引擎不緩存頁面內容 | Google, Yahoo, Bing |
nosnippet | 禁止在搜索引擎結果中顯示該頁面的任何描述。 | Google, Bing |
noimageindex | 要求此頁面不作為引用頁面的索引圖像的顯示。 | |
nocache | 和noarchive同義 | Bing |
提供了關于viewport初始大小的大小的提示。僅供移動設備使用。
值 | content取值 | 描述 |
---|---|---|
width | 整數或device-width | 定義viewport的像素寬度,或允許viewport適應設備的屏幕寬度。 |
height | 整數或device-height | 定義viewport的高度。沒有任何瀏覽器使用(???) |
initial-scale | 0.0 - 10.0 | 定義設備寬度(縱向模式下的設備寬度或橫向模式下的設備高度)與viewport大小之間的比例。 |
maximum-scale | 0.0 - 10.0 | 定義最大的縮放級別。它必須大于或等于minimum-scale,否則視為未定義。瀏覽器設置可以忽略此規則,iOS10 +默認情況下忽略它。 |
minimum-scale | 0.0 - 10.0 | 定義最小的縮放級別。它必須小于或等于maximum-scale,否則視為未定義。瀏覽器設置可以忽略此規則,iOS10 +默認情況下忽略它。 |
user-scalable | yes 或 no | 如果設置為no,用戶將無法放大網頁。默認值為yes。瀏覽器設置可以忽略此規則,iOS10 +默認情況下忽略它。 |
你可以設置一段時間后對頁面進行刷新操作。meta http-equiv=”refresh”可以指定瀏覽器延遲一段時間自動刷新頁面。下面的meta-tag指定瀏覽器每5秒自動刷新一次。
自動重定向我們可以使用refresh meta標簽對頁面進行重定向。下面的例子將在5秒后訪問www.25xt.com
禁止瀏覽器緩存當我們在本地測試網頁的時候,沒有及時更新新內容,可能就是有瀏覽器緩存。這個時候,我們只要通過使用Meta標簽禁用瀏覽器緩存,可以解決。通用代碼如下:
禁止百度轉碼
在移動開發當中,屏蔽數字當作電話號碼的代碼: 參考
MDN HTML element
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/50847.html
摘要:是用來在文檔中模擬協議的響應頭報文。標簽是語言區的一個輔助性標簽,它位于文檔頭部的標記和標記之間,它提供用戶不可見的信息。 meta是用來在HTML文檔中模擬HTTP協議的響應頭報文。META標簽是HTML語言HEAD區的一個輔助性標簽,它位于HTML文檔頭部的標記和標記之間,它提供用戶不可見的信息。meta標簽通常用來為搜索引擎robots定義頁面主題,或者是定義用戶瀏覽器上的coo...
摘要:前端技術之詳解第一天一部分略。。。。中國主要城市北京上海廣州美國主要城市紐約洛杉磯華盛頓西雅圖在瀏覽器中,默認是不會增加任何的效果改變的,但是語義變了,中的所有元素是一個小區域。前端技術之_CSS詳解第一天一html部分略。。。。二、列表列表有3種2.1 無序列表無序列表,用來表示一個列表的語義,并且每個項目和每個項目之間,是不分先后的。ul就是英語unordered list,無序列表的意...
閱讀 1556·2021-11-25 09:43
閱讀 2337·2019-08-30 15:55
閱讀 1468·2019-08-30 13:08
閱讀 2670·2019-08-29 10:59
閱讀 818·2019-08-29 10:54
閱讀 1586·2019-08-26 18:26
閱讀 2548·2019-08-26 13:44
閱讀 2656·2019-08-23 18:36