在head標籤中的meta標籤,可以為html文件提供額外資訊
meta屬性主要分為兩組
1.name屬性與content屬性
name屬性用於描述網頁,它是以名稱/值形式的名稱,name屬性的值所描述的內容(值)通過content屬性表示,便於搜尋引擎機械人查詢,分類.其中最重要的是description,keywords
2.http-equiv屬性與content屬性
http-equiv屬性用於提供http協議的響應頭報文(mime文件頭),它是以名稱/值形式的名稱,http-equiv屬性的值所描述的內容(值)通過content屬性表示,通常為網頁載入前提供給瀏覽器等裝置使用.其中最重要的是content-type charset 提供編碼資訊,refresh重新整理與跳轉頁面,no-cache 頁面快取,expires網頁快取過期時間.
應該保持在140-200個字元或者100個左右的漢字；
一張640*480：長640畫素，寬480畫素。單位面積上畫素點越多（即畫素點越小），這就越清晰細膩。但是每乙個畫素多少公釐取決於顯示器的解析度。a顯示器640*480，b顯示器1200*480，ab顯示器長寬相同。那麼在a顯示器上剛好鋪滿，每個畫素點很大，很粗糙，在b顯示器上不能鋪滿，每個畫素點比較小，比較清晰。
移動裝置上的viewport就是瀏覽器上用來顯示網頁的那部分區域。
一般來講，移動裝置上的viewport都是要大於瀏覽器可視區域的，這樣那些為桌面設計的**也能在移動瀏覽器上正常顯示，帶來的後果就是瀏覽器會出現橫向滾動條。移動裝置預設的viewport是layout viewport。
layout viewport 的寬度是大於瀏覽器可視區域的寬度的，layout viewport的寬度可以通過 document.documentelement.clientwidth 來獲取；（通常是980px）
visual viewport的寬度是瀏覽器可視區域的大小， visual viewport的寬度可以通過window.innerwidth 來獲取；
name="viewport"
content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
參考資料：
HTML之meta 響應式布局
在head標籤中的meta標籤,可以為html文件提供額外資訊 meta屬性主要分為兩組 1.name屬性與content屬性 name屬性用於描述網頁,它是以名稱 值形式的名稱,name屬性的值所描述的內容 值 通過content屬性表示,便於搜尋引擎 機械人查詢,分類.其中最重要的是descri...
HTML頁面響應式布局
同一套頁面可以相容不同解析度的裝置。實現 依賴於柵格系統 將一行平均分成12個格仔，可以指定元素佔幾個格仔 步驟 1.定義容器。相當於之前的table 容器分類 1.container 兩邊留白 2.container fluid 每一種裝置都是100 寬度 2.定義行。相當於之前的tr 樣式 ro...
HTML響應式布局實現詳解
1 viewport是網頁預設的寬度和高度，上面這行 的意思是 網頁寬度預設等於螢幕寬度 width device width 原始縮放比例 initial scale 1 為1.0，即網頁初始大小佔螢幕面積的100 所有主流瀏覽器都支援這個設定，包括ie9。對於那些老式瀏覽器 主要是ie6 7 8...