1像素邊框問題

以iPhone5爲例子： 設備分辨率爲1136*640 dp → （1136^2+640^2)開根號除以4 英寸屏幕 算得 等於326ppi → 326ppi 屬於 Retina屏幕，dpr=2 → 1px = dpr^2 * dp （這是1個像素正方形由4個dp組成）→ 因此 iPhone5 的屏幕爲320*568px 
<meta name = 'viewport'  content='name=value,name=value'>   例如：<meta name = 'viewport'  content = 'width=320' > 設置佈局viewport爲320像素 可是不能設置一個固定值，因此：設置'width=device-width' 佈局viewport始終等於設備寬度 
[list][*]width:設置佈局viewport的特定值（」device-width「）
[*]initial-scale:設置頁面的初始縮放
[*]minimum-scale:最少縮放
[*]maximum-scale:最大縮放
[*]user-scalable:用戶可否縮放
[/list]可是當頁面元素尺寸改變時，例如div的寬度從320px 變成 360 px 那麼他們的document.body.clientWidth = 320; window.innerWidth = 360；這樣會影響咱們的設計佈局，因此須要設置initial-scale=1；這樣頁面的縮放比都控制了 這樣咱們的佈局viewport和度量viewport都相等了
因此移動Web最佳viewport設置爲：佈局viewport = 設備寬度 = 度量viewport   →   （<meta name = 'viewport'  content='width=device-width,initial-scale=1,user-scalable=no'>）
設計移動Web
方案一：根據設備的實際寬度來設計（經常使用）
手機寬320px，咱們就拿320px設計
方案二：1px = 1dp 
縮放0.5。根據設備的物理像素dp等於抽象像素px來設計。1像素邊框和高清圖片都不須要額外處理。