Hintergrundbilder auf Elemente Anwenden
background-image-Eigenschaft ermöglicht das Hinzufügen eines Bildes als Hintergrund eines HTML-Elements. Die grundlegende Syntax ist sehr einfach:
background-image: url("image-url.jpg");
Als Wert für die background-image-Eigenschaft wird url() verwendet, und innerhalb dieser Klammern wird die Bild-URL angegeben.
index.html
index.css
background-repeat
Legt fest, ob das Bild horizontal, vertikal, in beide Richtungen oder gar nicht wiederholt wird.
background-repeat: repeat | repeat-x | repeat-y | no-repeat;
index.html
index.css
background-position
background-position wird verwendet, um die Startposition eines Hintergrundbildes innerhalb des Hintergrundbereichs eines Elements festzulegen. Mit dieser Eigenschaft kann bestimmt werden, wo das Hintergrundbild platziert wird und wie es relativ zum Element positioniert sein soll. Die Position muss auf der x- und y-Achse angegeben werden.
background-position: x y
index.html
index.css
background-size
Steuert, wie das Hintergrundbild skaliert wird:
background-size: auto | cover | contain | value in px/em/rem;
auto: ursprüngliche Bildgröße;cover: füllt das gesamte Element aus, kann zuschneiden;contain: passt das gesamte Bild an, kann leere Bereiche lassen;value: benutzerdefinierte Größe (z. B.100px50px,50%).
index.html
index.css
1. Was bewirkt die Eigenschaft background-image?
2. Was bewirkt die Eigenschaft background-repeat?
3. Welche Eigenschaft bestimmt die Position des Hintergrundbilds eines Elements?
Danke für Ihr Feedback!
Fragen Sie AI
Fragen Sie AI
Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen
Can you show me an example of how to use all these background properties together?
What is the difference between `cover` and `contain` for background-size?
How do I center a background image both vertically and horizontally?
Großartig!
Completion Rate verbessert auf 2.56Hintergrundbilder auf Elemente Anwenden
Swipe um das Menü anzuzeigen
background-image-Eigenschaft ermöglicht das Hinzufügen eines Bildes als Hintergrund eines HTML-Elements. Die grundlegende Syntax ist sehr einfach:
background-image: url("image-url.jpg");
Als Wert für die background-image-Eigenschaft wird url() verwendet, und innerhalb dieser Klammern wird die Bild-URL angegeben.
index.html
index.css
background-repeat
Legt fest, ob das Bild horizontal, vertikal, in beide Richtungen oder gar nicht wiederholt wird.
background-repeat: repeat | repeat-x | repeat-y | no-repeat;
index.html
index.css
background-position
background-position wird verwendet, um die Startposition eines Hintergrundbildes innerhalb des Hintergrundbereichs eines Elements festzulegen. Mit dieser Eigenschaft kann bestimmt werden, wo das Hintergrundbild platziert wird und wie es relativ zum Element positioniert sein soll. Die Position muss auf der x- und y-Achse angegeben werden.
background-position: x y
index.html
index.css
background-size
Steuert, wie das Hintergrundbild skaliert wird:
background-size: auto | cover | contain | value in px/em/rem;
auto: ursprüngliche Bildgröße;cover: füllt das gesamte Element aus, kann zuschneiden;contain: passt das gesamte Bild an, kann leere Bereiche lassen;value: benutzerdefinierte Größe (z. B.100px50px,50%).
index.html
index.css
1. Was bewirkt die Eigenschaft background-image?
2. Was bewirkt die Eigenschaft background-repeat?
3. Welche Eigenschaft bestimmt die Position des Hintergrundbilds eines Elements?
Danke für Ihr Feedback!
