Ich habe diese Nachricht vom Tab der Chrome Developer Tools-Konsole beim Zugriff erhalten jsfiddle.net:
Erwägen Sie die Verwendung von „dppx“-Einheiten anstelle von „dpi“, da „dpi“ in CSS Punkte pro CSS-Zoll bedeutet, nicht Punkte pro physischem Zoll, also nicht den tatsächlichen „dpi“ eines Bildschirms entspricht. In Medienabfrageausdruck: nur Bildschirm und (-webkit-min-device-pixel-ratio: 2), nicht alle, nicht alle, nur Bildschirm und (Mindestauflösung: 192dpi), nur Bildschirm und (Mindestauflösung: 2dppx)
Es ist in blauer Farbe, also gehe ich davon aus, dass es sich nicht um eine Warnung oder einen Fehler handelt. Warum bin ich auf diese Nachricht gestoßen? Wie kann ich es loswerden oder es ist nur ein Problem mit jsfiddle
selbst?
Dies hängt mit Apples Retina-Displays zusammen, ist aber möglicherweise nicht darauf beschränkt. Diese Displays haben eine höhere Pixeldichte als früher verwendete Bildschirme, aber der Browser verhält sich immer noch so, als hätte er die gleiche Anzahl von Pixeln.
Das iPhone 3GS hatte zB ein Display mit 320 x 480 Pixel, aber das iPhone 4 wurde mit 640 x 960 Pixel veröffentlicht. Anstatt die Website mit dieser Auflösung anzuzeigen, gab der Browser jedoch vor, eine Auflösung von 320 x 480 Pixel zu haben.
Dies führt weiter zur Erfindung von CSS-Pixeln. Wenn Sie angeben, dass etwas ist width:100px
in CSS wird es sein 100
Physikalische Pixel auf einem normalen Display, aber 200
physische Pixel auf einem Retina-Display. Ein iPhone 3GS und ein iPhone 4 haben beide das gleiche dpi
(da es auf vorgetäuschten CSS-Pixeln basiert) aber ganz anders dppx
(da dies auf den realen physischen Pixeln basiert).
Sie können verwenden dppx
um zu erkennen, wenn ein Client einen Bildschirm mit hoher Pixeldichte hat, und ihm ein anderes Design bereitzustellen, selbst wenn der Browser des Clients so tut, als hätte er keine so hohe Pixeldichte.
.comp {
background-image: url(image.png);
}
@media only screen and (min-resolution: 2dppx) {
.comp {
background-image: url([email protected]);
}
}
Mehr Infos hier zu CSS-Pixeln: https://developer.mozilla.org/en-US/docs/Web/CSS/resolution
Es ist eigentlich eine Chrome-Debug-Nachricht, und Sie können nicht viel dagegen tun, da sie auf dem Code basiert, der auf jsFiddle ausgeführt wird. Sie können die Debug-Meldungen herausfiltern, damit Sie sie nicht sehen, aber das war es auch schon.
– j08691
23. Februar 2014 um 17:04 Uhr
Es sollte eine Möglichkeit geben, diese lästige Meldung zu deaktivieren.
– Adam K. Dean
22. Januar 2015 um 10:49 Uhr