@-ms-viewport,@viewport
用於適配不同螢幕，因為在ie10的捕捉模式（snap mode）下，windows 8 metro模式下的乙個特性，可以將瀏覽器拖至螢幕的左端或右端，同時使用兩個視窗。奇怪的是， 要解決這個問題，開發者就要使用上面介紹的device-width方法，或者在media query裡面使用@viewport規則。
與minimum-scale, maximum-scale對應的描述符是max-zoom, min-zoom。zoom相當於initial-sacale，類似：
@viewport
其實就是的css化
首先應用固定布局轉換成流體布局，以適應不同解析度下的比例，更好的適應不同解析度使用者使用。第一點：布局採用的是流動布局，其基本原理是使用相對尺寸、結合百分比和em，用簡單的分割以找到相對應的畫素寬度。第二字型採用的是em，採用這兩個的好處就是，我們布局隨瀏覽器解析度改變時其大小也會相應做出調整；然後結合css media query在不同的**型別和**特性下構造不同的樣式，從而達到在不同解析度下顯示不同風格的頁面效果。
/*螢幕小於600px的pc瀏覽器, iphone和mobiles時的樣式
*/@media handheld and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 600px)
/*螢幕大於或等於900px是時的布局樣式
*/@media screen and (min-width: 920px)
/*螢幕大於或等於1350px的布局樣式
*/@media screen and (min-width: 1350px)
/*iphone
*/@media only screen and (max-device-width: 480px)
/*ipad
*/@media only screen and (min-device-width: 768px) and (max-device-width: 1024px)
其中
img
響應式布局 響應式布局技巧
一理解幾種布局的概念 1 靜態布局 static layout 即傳統web設計，對於pc設計乙個layout，在螢幕寬高有調整時，使用橫向和豎向的滾動條來查閱被遮掩部分 意思就是不管瀏覽器尺寸具體是多少，網頁布局就按照當時寫 的布局來布置 對於移動裝置，單獨設計乙個布局，使用不同的網域名稱如wap...
獲取手機裝置資訊
displaymetrics displaymetrics new displaymetrics this.getwindowmanager getdefaultdisplay getmetrics displaymetrics int height displaymetrics.heightpix...
獲取手機裝置 資訊
手機序列號 nsstring identifiernumber uidevice currentdevice uniqueidentifier nslog 手機序列號 identifiernumber 手機別名 使用者定義的名稱 nsstring userphonename uidevice cur...