iPhone / Android专用CSS

我正在为我的页面制作适合移动设备的样式表。 有没有一种简单的方法,使其显示到iPhone / Android用户的样式表? 或者我必须拉出用户代理,并以这种方式解决 – 我该怎么做?

另外 – 任何工具,使这种Web开发更容易?

  • 如何在chrome上的新方案中将parameter passing给android Intent?
  • 有没有办法消除移动触摸设备上的点击滞后?
  • 定向更改Android和iOS后的javascript最大视口高度
  • Android在使用固定宽度视口元标记时忽略最大比例
  • Eclipse控制台显示:“无法推送select:只读文件系统”,当我尝试推送文件
  • Phonegap的“onBodyLoad()/ onDeviceReady()”函数与Jquery的“$(document).ready()”之间的关系
  • 在HTML5 Web应用程序中无法在本机移动应用程序中实现的function是什么?
  • Android 4上的html5video:全屏播放,然后重定向到另一个网页 - 无法正常工作
  • 你可以做这样的事情,如果你的样式表是相同的iOS /机器人。

    <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="css/mobile.css" type="text/css" />

    但是,如果您尝试检测是iOS还是Android,那么您需要进行检测。

    在使移动开发更容易,有很多的东西:

    有几个让你开始:)

    希望这可以帮助。

    试试这个,在JavaScript中使用navigator.userAgent;)( http://css-tricks.com/snippets/javascript/redirect-mobile-devices/ ):

     if ((navigator.userAgent.match(/iPhone/)) || (navigator.userAgent.match(/iPod/))) { alert("we've got an iDevice, Scotty"); } if (navigator.userAgent.match(/Android/)) { alert("Droid me baby"); } 

    检测他的移动设备究竟使用什么用户和风格

    iPhone 4

     @media screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2){ .inphone4CSS{} } 

    目标三星Galaxy S2

     @media screen and (device-width: 320px) and (device-height: 534px) and (-webkit-device-pixel-ratio: 1.5){ .GalaxyS2_CSS{} } 

    更多关于它(或其他设备),你可以在这里find: 瞄准一个特定的设备