Lastnost clear
Lastnost clear prekliče
obtekajoči slog enega elementa z drugimi,
določen z lastnostjo float.
Lahko sprejme naslednje vrednosti:
none (prekliče delovanje samega sebe),
both (prekliče float hkrati na desni in levi),
left (prekliče float na levi), right (prekliče
float na desni).
Sintaksa
selektor {
clear: none ali left ali right ali both
}
Primer
Prekličimo obtekajoči slog slike z besedilom na levi:
<img class="image" src="bg.png" alt="">
<div class="txt">
<p>
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
</p>
</div>
.image {
float: left;
padding-right: 10px;
}
.txt {
clear: left;
}
:
Primer
Zdaj pa prekličimo obtekajoči slog slike z besedilom na desni:
<img class="image" src="bg.png" alt="">
<div class="txt">
<p>
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
</p>
</div>
.image {
float: right;
padding-right: 10px;
}
.txt {
clear: right;
}
:
Primer
Prekličimo delovanje same
lastnosti clear:
<img class="image" src="bg.png" alt="">
<div class="txt">
<p>
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
besedilo besedilo besedilo besedilo besedilo besedilo
</p>
</div>
.image {
float: right;
padding-right: 10px;
}
.txt {
clear: none;
}
:
Glejte tudi
-
lastnost
bottom,
ki določa pozicijo spodnjega roba elementa -
lastnost
top,
ki določa pozicijo zgornjega roba elementa -
lastnost
left,
ki določa pozicijo levega roba elementa -
lastnost
right,
ki določa pozicijo desnega roba elementa -
psevdoelement
::backdrop,
ki določa pozicioniranje za prvim elementom -
lastnost
caption-side,
ki določa pozicijo naslova tabele