Hvordan flytte rundt på teksten et bilde med HTML eller CSS

Hvordan flytte rundt på teksten et bilde med HTML eller CSS


Når du ta et bilde med teksten på websiden, viser standard stilen illustrasjonen over eller under omkringliggende innhold, forlater tomrom til venstre og høyre for bildet. Det er sløsing med plass og gjør bildet bli usammenhengende fra teksten din. For å fikse dette, har du muligheten til å bruke enten Hypertext Markup Language (HTML) eller Cascading Style Sheets (CSS) for å angi plasseringen av bildet slik at teksten flyter rundt kantene av bildet. Bruk HTML eller CSS for å flytte teksten rundt bildene dine, som du foretrekker.

Bruksanvisning

HTML

1 Start siden filen på datamaskinen din tekst editor program og plasser markøren på innsiden av "<img>" tag. Skriv "align =" og følg denne med anførselstegn som så:

<Img align = "" />

2 Enter "riktig", "venstre", "midten", "topp" eller "bottom" etter justere innreise til å angi hvor bildet vises i forhold til teksten. En "top" justering gjør innholdet vises på det høyeste punktet i bildet, "midt" flytter teksten til midten av bildet og "bunnen" dirigerer innhold å starte på bunnen av grafikken. I tillegg kan en "riktig" posisjon, flytter dataene til venstre på bildet og en "venstre" alignment steder innhold til høyre i bildet. Skriv koden som følger:

<Img align = "top" />

3 Lagre filen.

CSS

4 Plasser markøren i "<img>" tag og type "style =" med et sett av anførselstegn før siste vinkeljern. Å illustrere:

<Img style = "" />

5 Skriv "float:" inne i anførselstegn, og skriv inn "venstre" eller "høyre" attributt for å nevne justeringen av grafikken. Den "venstre" verdi gjør bildet vises til venstre og flytter teksten til høyre, mens den "riktige" attributtet gjør det motsatte. For eksempel:

<Img style = "float: right" />

6 Lagre dokumentet.