我如何使网站的移动版本能够在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