如何在django中为移动设备(手机/平板电脑)设计Web应用程序

Question

是否可以分析客户端浏览器并为移动设备提供特殊设计的布局？

此外，如何实现一些可在移动设备上使用的奇特小工具，如"下拉菜单"和其他东西，如日期/时间选择等？别忘了以智能手机或平板电脑的方式从一根棍子跳到另一根棍子的风格和艺术——怎么样？

我是这种应用程序/网络开发的新手，所以任何提示都可以。

到目前为止的结论：使用像bootstrap这样的响应式Web设计来解决与小屏幕和更改纵横比有关的问题，以及像jQuery这样的小工具工具箱

现在的具体问题是如何将所有这些实现到0815的"django应用程序"中？

Answer 1

我建议你给推特引导一个机会http://getbootstrap.com/当涉及到响应式网站的开发时，它变得越来越受欢迎。他们最近实现了新版本（Bootstrap 3），它真的很棒，可以帮助你轻松控制在特定屏幕大小上显示什么和如何显示。

如果你想了解更多信息，你也可以访问这个youtube频道http://www.youtube.com/user/CodersGuide?feature=watch

Answer 2

你当然可以列出常见的浏览器字符串，为安卓/iOS上最常见的浏览器创建自定义布局，并直接为它们服务。（非首选）

然而，通常首选的方法是使用CSS媒体查询进行响应web。这些查询看起来像：

@media screen and (min-device-width:321px)
{
    ...
}
@media screen and (min-width:769px)
{
    ...
}
@media screen and (min-width:1025px)
{
    ...
}

在上面写着...的位置，您可以为所有元素进行自定义类/定位/样式设置。但谷歌是你的朋友，可以为这些找到好的教程。

此外，还有许多CSS/JavaScript库可以为移动设备创建良好的按钮/布局。这些库通常考虑到按钮的触摸区域需要大于可见区域，并且元素之间有足够的间距。通常，它们还包括"移动"小部件，例如弹出的花哨对话框选择器，看起来就像iOS或Android上的本地弹出窗口。谷歌将再次成为你的朋友。

然而，如果你发现自己被迫进行浏览器字符串比较，不要指望你对设备的猜测是正确的。浏览器字符串相当棘手，不会显示设备的大量信息。例如，您可能不知道访问者是在平板电脑还是智能手机上使用Chrome for Android。例如，您可以使用浏览器字符串来确定用户是在Android还是iOS上。但对于Android来说，不要指望能够从浏览器环中识别出市场上所有可能的屏幕截图/设备。