關于meta name="viewport"詳解

在手機網站建設中，我(wo)們經(jing)常(chang)會看(kan)到網頁頭(tou)的(de)元標簽中含(han)有viewport。使用這樣的(de)標簽，其作(zuo)用是(shi)使手機瀏覽的(de)時候(hou)按照一(yi)定的(de)縮放比例以及一(yi)定的(de)寬(kuan)度來顯示頁面(mian)。下面(mian)我(wo)們詳細解(jie)讀一(yi)下viewport元標簽的(de)使用。

meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"

以(yi)上的語句(ju)(ju)是一(yi)句(ju)(ju)含有所有元(yuan)素(su)的viewport元(yuan)標簽(qian)，我們(men)對(dui)每句(ju)(ju)話進行一(yi)個詳細的解釋：

1. width=device-width - 設置頁面的寬度，device-width代表設備的屏幕寬度。width=device-width即寬度等于屏幕的寬度。同理也有height=device-height，一般很少用。
2. initial-scale - 頁面初始化的縮放比例，1.0代表原始比例。如果使用2.0則代表雙倍放大。
3. minimum-scale=1.0 - 用戶允許縮小到的最小比例
4. maximum-scale=1.0 - 用戶允許放大到的最大比例
5. user-scalable=no - 用戶是否可以手動縮放。no為不可以，如果不加該語句，默認用戶可以手動縮放。

 在(zai)如今(jin)wap2.0的頁面(mian)中，以上語(yu)句(ju)是必不可少的，這個對手機用戶(hu)的用戶(hu)體驗度(du)會有非常大的影響。