2012-04-04 2 views
0

Hallo, damit ich eine Medienabfrage, die von ios Simulator aufgenommen wirdMedienanfragen und firefox/chrom

<link rel="stylesheet" media="all and (max-device-width: 480px)" href="css/iphone.css"> 

Was ich möchte, dies zu tun auf Firefox oder Chrome ist zu simulieren, indem Sie den Browser Ändern der Größe, das ist möglich?

+0

Es ist in der Tat. Ändern Sie einfach die Größe Ihres Browsers. –

Antwort

1
<link type="text/css" rel="stylesheet" href="css/iphone.css" media="all and (max-width: 480px)" /> 
+0

Würde es Ihnen etwas ausmachen, Ihre Antwort zu erklären? –

+0

Vielleicht habe ich nicht die ursprüngliche Frage verstanden, aber ... Ich verstand, dass er, was CSS/iphone.css in Chrome/Firefox verwenden, wenn Fenster unter 480px Größe geändert wird. – kubedan

+3

Das ist richtig, aber einfach etwas Code zu posten ist nicht sehr hilfreich ... –

-1

Ja, Sie können dies direkt auf Firefox und Chrome simulieren. Aber Firefox unterstützt Medienabfragen unter 480 nicht.

Sie können auch den untenstehenden Link für die Neugröße in Firefox & Chrom überprüfen. http://www.smashingmagazine.com/

this helps

0

Sie müssen max-width verwenden. max-device-width ist die physische Bildschirmgröße, so dass sich nicht ändert. Siehe: What is the difference between max-device-width and max-width for mobile web?

Allerdings löst das Ihr Problem für iOS nicht vollständig, da Safari standardmäßig eine Breite (aber keine Gerätebreite) von 980px meldet, sodass Seiten, die nicht für Mobilgeräte konzipiert sind, als voll ausgezoomt angezeigt werden Seite. So müssen Sie auch etwas zu Ihrem HTML hinzuzufügen:

<meta name="viewport" content="initial-scale = 1.0"> 

Sie einen Verweis von Apple auf Ansichtsfenster-Einstellungen finden Sie hier: http://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html