CSS-Bilder

Das Modul CSS-Bilder definiert die Arten von Bildern, die verwendet werden können (den <image>-Typ, der URLs, Verläufe und andere Arten von Bildern enthält), wie sie skaliert werden und wie sie und andere Ersatzelemente mit den verschiedenen Layoutmodellen interagieren.

Referenz

Eigenschaften

• image-orientation
• image-rendering
• object-fit
• object-position
• object-view-box

Das CSS-Bilder-Modul definiert auch die image-resolution-Eigenschaft. Derzeit unterstützen keine Browser diese Funktion.

Funktionen

• linear-gradient()
• radial-gradient()
• repeating-linear-gradient()
• repeating-radial-gradient()
• conic-gradient()
• repeating-conic-gradient()
• cross-fade()
• element()
• image-set()

Das CSS-Bilder-Modul definiert auch die image()-Funktion. Derzeit unterstützen keine Browser diese Funktion.

Datentypen

• <gradient>
• <image>

Leitfäden

Verwenden von CSS-Verläufen

Stellt einen spezifischen Typ von CSS-Bildern vor, Verläufe, und wie man diese erstellt und verwendet.

Implementierung von Bildspritzen in CSS

Beschreibt die gängige Technik, mehrere Bilder in einem einzigen Dokument zu gruppieren, um Download-Anfragen zu sparen und die Verfügbarkeit einer Seite zu beschleunigen.

Gestaltung von Ersatzelementen

Führt die Eigenschaften ein, die nur für Ersatzelemente gelten.

Verständnis von Seitenverhältnissen

Lernen Sie die aspect-ratio-Eigenschaft, diskutieren Sie Seitenverhältnisse für ersetzte und nicht ersetzte Elemente und untersuchen Sie einige gängige Anwendungsfälle für Seitenverhältnisse.

Verwenden der CSS-Eigenschaft object-view-box

Lernen Sie die CSS-Eigenschaft object-view-box, einschließlich wie man hinein- und herauszoomt und über Bilder schwenkt.

Verwandte Konzepte

• <url>
• url()
• <basic-shape-rect>

Spezifikationen

Siehe auch

• CSS-Filtereffekte Modul
• CSS-Komposition und Überblendung Modul
• CSS-Farben Modul
• CSS-Werte und Einheiten Modul