Du spør om å endre hvordan bilder vises i nettutvikling. Slik transformerer du en inline grafikk til en flytende grafikk:
Forstå forskjellen
* inline grafisk: En inline -grafikk vises innenfor flyten av teksten, som et vanlig ord eller karakter. Det blir behandlet som en del av tekstinnholdet.
* Flytende grafisk: En flytende grafikk er plassert utenfor strømmen av teksten, slik at tekst kan vikle seg rundt den.
trinn for å endre en inline grafikk til en flytende grafisk
1. Legg til en beholder: Hvis bildet ditt ikke har et containerelement (som en `
`), må du legge til en. Dette gir en struktur for styling av den flytende oppførselen.
`` html
`` `
2. Bruk CSS: Bruk CSS for å bruke `float` -egenskapen på bildet eller beholderen.
`` CSS
.Image-Container {
FLOAT:Venstre; /* eller float:høyre; */
Bredde:200px; / * Juster bredden etter behov */
}
`` `
* `float:til venstre;` Plasserer bildet til venstre, med tekstpakking rundt på høyre side.
* `float:høyre;` Plasserer bildet til høyre, med tekstinnpakning rundt venstre.
* `bredde:200px;` Angir bildebredden. Juster dette slik at det passer til designen din.
Eksempel:
`` html
.Image-Container {
FLOAT:Venstre;
Bredde:200px;
}
Dette er litt tekst før bildet.
Og dette er tekst etter bildet.
