it-swarm.com.de

Exklusives CSS für iPhone/Android

Ich erstelle ein mobilfreundliches Stylesheet für eine Seite von mir. Gibt es eine einfache Möglichkeit, dieses Stylesheet für iPhone/Android-Benutzer anzuzeigen? Oder muss ich die Benutzeragenten ziehen und so herausfinden - und wie mache ich das?

Außerdem - irgendwelche Werkzeuge, um diese Art von Web-Entwickler einfacher zu machen?

iphoneandroidhtmlcssmobile
16
AKor

Sie könnten so etwas tun, wenn Ihr Stylesheet für iOS/Android gleich ist. 

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

Wenn Sie jedoch herausfinden möchten, ob es sich um iOS OR Android handelt, müssen Sie die Erkennung durchführen.

Um mobile Geräte einfacher zu machen, gibt es eine Menge Sachen:

Es gibt ein paar, mit denen du anfangen kannst :)

Hoffe das hilft.

18
TNC

Versuchen Sie es mit navigator.userAgent in JavaScript;) (Mit freundlicher Genehmigung dieses tollen Beitrags 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");
}
4
Kevin Pajak

Bitte überprüfen Sie diesen Beitrag http://www.rkblog.rk.edu.pl/w/p/optimizing-websites-iphone-and-Android/

2
AlexKorovyansky

ermitteln Sie, was Benutzer und Stil für sein Mobilgerät genau verwenden

iPhone 4

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

traget Target Samsung Galaxy S2

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

mehr darüber (oder ein anderes Gerät) finden Sie hier: Ein bestimmtes Gerät ansprechen

0
Arthur