我如何使網站的移動版本能夠在android，iphone，ipad上運行？

Question

我想為其移動版本復制一個站點。 該站點具有滑塊，簡單的頁眉，頁腳和下拉列表。

我們是否能夠為移動設備做出准確的定義（在我的情況下，我是在談論jQuery中的滑塊和下拉菜單）。

我想要的是對移動設備的感覺與對普通網站的感覺相同。 就像我在視頻示例中看到的那樣，人們向ipad展示（演示），iphone單擊菜單，頁面向右滑動，某些東西顯示為新頁面。 我不要這個

我想選擇移動版中現有的主題和顏色方案。

我該怎么做。

Answer 1

為此，我們有一個稱為響應式網頁設計的東西：)

你可以在這里看看：

http://www.netmagazine.com/tutorials/build-sensitive-site-week-designing-sensitively-part-1

Answer 2

另一個不錯的起點： http : //html5boilerplate.com/

Answer 3

這個主題比簡單地添加幾行代碼要復雜得多，但是我可以提供以下內容：

如果您想要單獨的移動設備和台式機（我建議不要這樣做），則必須進行一些設備嗅探。 最簡單的方法可能是檢查屏幕尺寸並重定向，如果它小於320px或您決定的任何尺寸。

這將使您的頁面加載慢一些，因為您將不得不等待頁面解析屏幕大小檢測腳本，檢查其屏幕是否過小，然后重定向。 在移動設備上這將花費很長時間，並且由於加載時間較慢，您不會吸引任何粉絲。

響應式設計是最佳解決方案。 我認為您應該退后一步，考慮為什么要將站點拆分為兩個不同的站點，以及是否要有能力不斷維護這兩個站點。

Answer 4

您需要使用媒體查詢http://www.w3.org/TR/css3-mediaqueries/

通過媒體查詢，您可以為其他設備設置樣式並保存相互的html ...

Answer 5

您可以使用DDR來根據特定的移動設備定制內容，而不是采用響應式設計： http : //wurfl.sourceforge.net