meta 標(biāo)簽分兩大部分:HTTP 標(biāo)題信息(http-equiv)和頁(yè)面描述信息(name)。
- 1、聲明文檔使用的字符編碼
<meta charset='utf-8'>
以下設(shè)置更為詳細(xì):
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- 2、聲明文檔的兼容模式
// 指示IE以目前可用的最高模式顯示內(nèi)容
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="X-UA-Compatible" content="IE=Emulate IE7" />
// 指示IE使用 <!DOCTYPE> 指令確定如何呈現(xiàn)內(nèi)容。標(biāo)準(zhǔn)模式指令以IE7 標(biāo)準(zhǔn)模式顯示,而 Quirks 模式指令以 IE5 模式顯示
4、為移動(dòng)設(shè)備添加 viewport
<meta name ="viewport" content ="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
/*
content 參數(shù)解釋:
width viewport 寬度(數(shù)值/device-width)
height viewport 高度(數(shù)值/device-height)
initial-scale 初始縮放比例
maximum-scale 最大縮放比例
minimum-scale 最小縮放比例
user-scalable 是否允許用戶縮放(yes/no)
minimal-ui IOS 7.1 beta 2 中新增屬性,可以在頁(yè)面加載時(shí)最小化上下?tīng)顟B(tài)欄。這是一個(gè)布爾值,可以直接這樣寫(xiě):
*/
<meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
- 強(qiáng)制讓文檔與設(shè)備的寬度保持 1:1 ;
- 文檔最大的寬度比列是1.0( initial-scale 初始刻度值和 maximum-scale 最大刻度值);
- user-scalable 定義用戶是否可以手動(dòng)縮放( no 為不縮放),使頁(yè)面固定設(shè)備上面的大小;