關於響應式設計的移動破解點

Question

不是移動設計人員，而必須與我的一些供應商合作爲我的公司製作移動網站。

他們提供的視覺設計圖像有3個斷點。基本上線說明網站將如何尋找320px，600px和768px以上。

現在，當我問我的供應商哪裏會顯示iphone 4的縱向分辨率爲640，他說它會顯示320個斷點。他向我展示了以下網站，其中有一個名爲Device-W的專欄，他說這個專欄應該在網站開發過程中使用。 http://screensiz.es/phone

現在的事情是在我去開發供應商之前，我想要一個人來幫助我理解什麼是設備-W在單位術語中，以確保不會做出任何錯誤的決定。

Answer 1

This link should help you。

device-width指的是設備本身的寬度，換句話說就是設備的屏幕分辨率。大多數手機的設備寬度爲 480像素或更低，包括流行的iPhone 4（設備寬度： 320像素），儘管它技術上具有640 x 960的分辨率。由於iPhone 4的視網膜顯示屏，這是 ，它將兩個設備像素分成 屏幕上的每個CSS像素。 Ipad 3也是如此;它的 報告的設備寬度是768px，就像它的前輩一樣，儘管 它的實際屏幕分辨率是1536px x 2048px。一般來說，寬度爲 的功能在創建響應式網頁時更爲靈活，但 設備寬度在您希望專門定位移動設備（而不是具有小瀏覽器窗口的桌面）時非常有用，因爲 很少有桌面設備屏幕分辨率低於某個數字，如 爲320px x 480px。