Was ist der beste Weg, Medienabfragen zu verwenden, um sowohl eine Retina-Anzeige zu erkennen als auch max-width anzugeben?
Ich kann die Netzhaut mit
Wie füge ich es zu den Medienabfragen hinzu? Schreib ich
%Vor%Oder gibt es eine bessere Methode für den Wechsel von Bildern für Retina-Displays? (Hinzufügen von Medienabfragen für die Bildschirmgröße zu Medienabfragen für die Retina-Anzeige)
Sie würden wahrscheinlich alle Retina-Displays nach diesem Artikel von CSS- abdecken. Tricks. Ich nehme an, du hast das schon herausgefunden. Eine andere Option ist die Verwendung von SVG's, aber ich würde sie nicht für Hintergrundbilder verwenden. Das SVG-Format eignet sich perfekt für zweidimensionale Formen und Symbole, auch wenn Symbolschriften schneller gerendert werden.
Wie bei der Frage "Wie Medienabfragen für die Bildschirmgröße zu Medienabfragen für die Retina-Anzeige hinzugefügt werden" sollte der von Ihnen gepostete Code gut funktionieren. Ein anderer Weg wäre, einfach die zweite Klausel zu den ersten hinzuzufügen:
%Vor%Wenn Sie SCSS verwenden, erstellen Sie ein Mixin wie in hier . Dies würde Ihnen viel Zeit sparen und die Lesbarkeit drastisch verbessern.
Tags und Links css retina-display media-queries