在移動瀏覽器中使用viewport元標(biāo)簽控制布局
1.背景
移動端瀏覽器（如Fennec）在一個(gè)通常比屏幕更寬的虛擬 "窗口"（視口）中渲染頁面，從而無需將所有頁面都壓縮進(jìn)小屏幕里（那樣會把很多沒有針對移動端進(jìn)行優(yōu)化的站點(diǎn)打亂）。用戶可以通過平移和縮放來瀏覽頁面的不同區(qū)域。
Mobile Safari 引入了”viewport元標(biāo)簽“來讓web開發(fā)者控制視口的尺寸及比例。如今許多其他移動端瀏覽器已經(jīng)支持這一標(biāo)簽，雖然它不是任何web標(biāo)準(zhǔn)的一部分。蘋果的文檔詳盡地說明了web開發(fā)人員可以怎樣使用這一標(biāo)簽，然而我們還是不得不仔細(xì)推敲Fennec究竟應(yīng)該怎樣實(shí)現(xiàn)它。例如，Safari的文檔指出標(biāo)簽的內(nèi)容應(yīng)為 "由逗號分隔的列表"，但是現(xiàn)有的瀏覽器和網(wǎng)頁都把逗號、分號及空格混用作分隔符。
2.視口基礎(chǔ)
一個(gè)典型的針對移動端優(yōu)化的站點(diǎn)包含類似下面的內(nèi)容：

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

width屬性控制視口的寬度?？梢韵駑idth=600這樣設(shè)為確切的像素?cái)?shù)，或者設(shè)為device-width這一特殊值來指代比例為100%時(shí)屏幕寬度的CSS像素?cái)?shù)值。（相應(yīng)有height及device-height屬性，可能對包含基于視口高度調(diào)整大小及位置的元素的頁面有用。）
initial-scale屬性控制頁面最初加載時(shí)的縮放等級。maximum-scale、minimum-scale及user-scalable屬性控制允許用戶以怎樣的方式放大或縮小頁面。（未完待續(xù)）