如何處理響應式設計和iPad/iPhone

Im正在努力應對敏感的設計。如何處理響應式設計和iPad/iPhone

所有尺寸均以百分比表示，並開始按照「常規」屏幕上的預期工作。

通過JavaScript我確定窗口的寬度和高度，它設置背景圖像。背景圖片使用css3「封面」屬性。

但是，一切顯然是在iPad/iPhone上搞亂了。當pagecontent溢出pageheight時（大部分頁面都會這樣做，並且應該是這樣），那麼「cover」屬性顯然會展開並顯示圖片太大。高度和邊距突然變得過高。

我的猜測是，iPhone/iPad正在考慮整個內容，包括飛越內容作爲整頁高度，而不僅僅是實際的可見屏幕......但我不知道如何處理它。

另外，當我提醒窗口寬度時，我得到：iPad，iPhone4和iPhone3上的980。我猜想，我不能使用窗口寬度，在iPhone/iPad ....？

我該如何處理移動設置？

我的希望是我不需要創建iPhone/iPad特定的設置......但我開始擔心我需要？

這裏是playgroundwith設計：http://basix.popweb.dk

任何幫助或建議？

THX 約翰

來源

2013-03-13 John K

你看過CSS和[媒體查詢]（http://www.w3.org/TR/css3-mediaqueries/）嗎？ – 2013-03-13 21:56:14

你看過http://twitter.github.com/bootstrap/？ – Watt 2013-03-13 21:57:10

是的，我知道媒體查詢。但我正在試圖找出如何以最簡單的方式處理這個問題。學習。 – 2013-03-13 22:05:59

嗯，我剛纔檢查在iPhone上你的網站，它似乎加載好，但佈局似乎沒有響應我。

無論如何，你使用任何CMS？

此外，當我學習材料時，我建議您檢查http://themble.com/bones/ 儘管它是一個wordpress主題，但是樣式表很好地體現了什麼可行。不過，它使用SASS或LessCSS（CSS預處理器），我建議學習它，因爲它可以在編寫CSS時節省大量時間。這並不難，我已經在大約2小時內學會了LessCss http://lesscss.org/。

來源

2013-04-14 00:13:59

如何處理響應式設計和iPad/iPhone

回答

相關問題