Hallo Zusammen
Ich interessiere mich für Responsive Design und habe heute zum ersten Mal die css media queries an meiner neuen Seite ausprobiert. CSS Media Queries
Damit kann man bestimmen für welche Auflösungen welches Stylesheet geladen werden soll. Es ist echt genial und funktioniert echt toll auf meinem 1600 x 900 Bildschirm wird ein anderes Stylesheet geladen als auf meinem 1024 x 768 Bildschirm.
Allerdings habe ich ein Problem mit Smartphone-Auflösungen. Ich habe verschiedene Smartphone-Emulatoren ausprobiert, aber bei keinen von diesen wird ein Stylesheet geladen. Ich sehe nur die einzelnen Elemente der Seite ohne Style.
Hier mein Code im HTML
Danke schonmal im voraus für die Antworten
Gruss Turmuhr
Ich interessiere mich für Responsive Design und habe heute zum ersten Mal die css media queries an meiner neuen Seite ausprobiert. CSS Media Queries
Damit kann man bestimmen für welche Auflösungen welches Stylesheet geladen werden soll. Es ist echt genial und funktioniert echt toll auf meinem 1600 x 900 Bildschirm wird ein anderes Stylesheet geladen als auf meinem 1024 x 768 Bildschirm.
Allerdings habe ich ein Problem mit Smartphone-Auflösungen. Ich habe verschiedene Smartphone-Emulatoren ausprobiert, aber bei keinen von diesen wird ein Stylesheet geladen. Ich sehe nur die einzelnen Elemente der Seite ohne Style.
Hier mein Code im HTML
Code:
<head>
<link rel="stylesheet" href="css/16zu9.css" media="only screen and (min-width : 1224px)" />
<link rel="stylesheet" href="css/4zu3.css" media="screen and (min-device-width : 768px) and (max-device-width : 1025px)" />
<link rel="stylesheet" href="css/smartphone-all.css" media="screen and (max-device-width : 400px)" />
</head>
auch so gehts nicht:
<link rel="stylesheet" href="css/16zu9.css" media="only screen and (min-width : 1224px) and (max-device-width : 2000px;)" />
<link rel="stylesheet" href="css/4zu3.css" media="screen and (min-device-width : 768px) and (max-device-width : 1025px)" />
<link rel="stylesheet" href="css/smartphone-all.css" media="screen and (min-device-width: 250px) (max-device-width : 750px)" />Danke schonmal im voraus für die Antworten
Gruss Turmuhr
