The Web Writer Wizard's Guide til Internet
Programmering
Wizband Left

Komplet Kode til Eksemplet med Egenskaben "clear"

<HTML> <HEAD> <TITLE>Egenskaben clear</TITLE> <STYLE TYPE="text/css"> IMG.Float { float:left; margin:10px; } P { clear:left; } </STYLE> </HEAD> <BODY> <H1>Egenskaben "clear"</H1> <P>Det er her blot en eller anden tekst i det første afsnit. Det er egentlig blot noget fyld, som skal vise, hvordan tekst flyder omkring et billede, der er placeret <IMG SRC="author.jpg" BORDER="0" WIDTH="100" HEIGHT="137" ALIGN="bottom" ALT="Billede, der illusterer floats" CLASS="Float"> her i selve teksten. Billedet er med vilje valgt så stort, at det fortsætter under teksten i dette afsnit. Faktisk gåer det en hel del længere ned. Så meget at det er ved at knibe at finde på mere tekst til dette afsnit, som jeg derfor vil slutte her.</P> <P>Derfor bliver andet afsnit også påvirket, idet linieboksen skubbes til side, så de ikke overlapper det flydende billedes margener. Også i dette afsnit er det nødvendigt med en masse tekst, da billedet er virkeligt dybt, og vi stadig ikke er nået ned under det, selv om linierne bliver list kortere. Boksene er stadig firkantede, men rammer og baggrunde klippes i stykker af det flydende billede. For at skabe lidt luft omkring billedet, har jeg givet det en margen på 10 pixels, selv om det egentlig falder uden for dette eksempels område. Til gengæld ser det en hel del pænere ud, end hvis teksten havde gået helt ud til billedet. Se eksemplets kildekode, hvis du vil se, hvordan det gøres. Ellers læs beskrivelsen i det kapitel, der handler om bokse. Der lærer du alt, hvad der er at vide om sådan noget.</P> </BODY> </HTML>


Wizband Right