Einzelnen Beitrag anzeigen
  #2 (permalink)  
Alt 02.08.2016, 10:36
cloned cloned ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.247
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

Es gibt keine Standardgrößen und Mediaqueries sind auch nicht dafür da um so verwendet zu werden wie du es dir vorstellst. Löse dich bitte von der Vorstellung für "Handys" ein CSS und für "Tablets" ein anderes CSS und für iPhone vllt noch ein anderes "CSS" zu erstellen. Mediaqueries sind dafür gedacht, um bei verschiedenen Auflösungen Inhalt unterschiedlich anzuzeigen. Da kann es dir, sofern du dich von der anfänglich erwähnten Vorstellung verabschiedet hast, herzlich egal sein, wie "Standardisiert" die Auflösungen sind.
Hier kurz eine Anmerkung: Jede dieser rosa-kasterl kann ein mobile-device sein.

Genug der Theorie, wie schaut das in der Praxis aus:
Du sortierst deine Mediaqueries von Groß nach Klein (oder umgekehrt, hauptsache sortiert )
Code:
@media only screen and (max-width:64em) {

}

@media only screen and (max-width: 61.875em){/*990px*/

}

@media only screen and (max-width:60em){/* - 960*/

}

@media only screen and (max-width: 32.500em) {/*bis 520  */

}
So in etwa kann das aussehen. Die Werte müssen natürlich "an deine Website" angepasst werden. Und nicht an Geräte! Das ist, was viele bei Mediaqueries/wir sind jetzt responsive falsch verstehen.
Auch ist wichtig, dass du keine fixen Größen verwendest sondern mit max-width, bzw. mit Prozenten etc. arbeitest. Kommt jetzt ein Handy mit 880px max-Breite daher, dann passt die Darstellung weil das CSS von 612.875em greift. Man muss hier uach nur die Änderungen zwischen den einzelnen Auflösungen notieren.
Beachte auch, dass orientation etc. nicht wirklich benötigt werden.
Mit Zitat antworten
Sponsored Links