Warum stehen meine Bilder auf dem Kopf? Ein Blick auf die CSS-Eigenschaft „image-orientation'.

Probleme mit der Bildausrichtung mit dem img-Tag

Bei der Anzeige eines Bildes mit dem img-Tag kann es manchmal vorkommen, dass die Ausrichtung falsch ist, was zu einem Aufwärtstrend führt -Down-Bild. Dieses Problem ist auf Bildmetadaten zurückzuführen, die die beabsichtigte Ausrichtung des Fotos angeben.

Um dieses Problem zu beheben, hat CSS die Eigenschaft „image-orientation“ eingeführt. Durch Hinzufügen des folgenden CSS zu Ihrem Stylesheet können Sie die Bildausrichtung korrigieren:

<code class="css">img {
    image-orientation: from-image;
}</code>

Zum Zeitpunkt dieser Antwort (25. Januar 2016) werden Firefox und iOS Safari (mit einem Präfix) unterstützt die Bildausrichtungseigenschaft. Bei Safari und Chrome können jedoch weiterhin Probleme auftreten. Mobile Safari scheint die Ausrichtung nativ zu handhaben, ohne dass CSS erforderlich ist.

Bis eine umfassendere Browserunterstützung verfügbar ist, können wir damit rechnen, dass diese Ausrichtungsprobleme bestehen bleiben.

Das obige ist der detaillierte Inhalt vonWarum stehen meine Bilder auf dem Kopf? Ein Blick auf die CSS-Eigenschaft „image-orientation'.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!