Open main menu

Changes

Mobile Devices

85 bytes added, 20:01, 11 June 2010
→‎Basic techniques
==Basic techniques==
* choose device-specific CSS based on screen width:
<code> <LINK REL=StyleSheet HREF="desktop.css" TYPE="text/css" media="screen,projection,tv and (min-width: 501px)"> <link rel="stylesheet" media="handheld, screen and (max-width: 500px)" href="smallscreen.css" type="text/css"></code>* or put the query in your css file; @media screen and (min-width: 400px) and (max-width: 700px) { ... }
* set the "viewport" on the device so the page scales to an appropriate size
<code> <meta name="viewport" content="width=device-width"></code>
==OPACs==
* [http://sourceforge.net/projects/mitmobileweb/ MIT Mobile Framework]
* Webkit
* Drupal "Sections": different themes based on URL (e.g. "m.drupalsite.com" gets a different theme)
Anonymous user