Sie fragen nach Änderungen, wie Bilder in der Webentwicklung angezeigt werden. Hier erfahren Sie, wie Sie eine Inline -Grafik in eine schwimmende Grafik verwandeln können:
den Unterschied verstehen
* Inline -Grafik: Eine Inline -Grafik erscheint im Fluss des Textes, wie ein normales Wort oder ein normales Zeichen. Es wird als Teil des Textinhalts behandelt.
* schwimmende Grafik: Eine schwimmende Grafik ist außerhalb des Textflusses positioniert, sodass Text sich um ihn wickeln kann.
Schritte zum Ändern einer Inline -Grafik in eine schwebende Grafik
1. einen Behälter hinzufügen: Wenn Ihr Bild kein Containerelement hat (wie ein `
`), müssen Sie eines hinzufügen. Dies bietet eine Struktur zum Styling des schwimmenden Verhaltens.
`` `html
`` `
2. CSS anwenden: Verwenden Sie CSS, um die Eigenschaft "Float" auf Ihr Bild oder seinen Container anzuwenden.
`` `CSS
.image-container {
float:links; /* oder float:richtig; */
Breite:200px; / * Passen Sie die Breite nach Bedarf an *//
}
`` `
* `float:links;` Positioniert das Bild links und wickelt sich mit dem Text um die rechte Seite um.
* `float:rechts;` Positioniert das Bild nach rechts und wickelt sich mit der linken Seite um.
* `width:200px;` Legt die Bildbreite fest. Passen Sie dies an Ihr Design an.
Beispiel:
`` `html
.image-container {
float:links;
Breite:200px;
}
Dies ist ein Text vor dem Bild.
Und dies ist Text nach dem Bild.
