KOMPOOS.NL

wrap text

home » css » wrap-text-around-image.html

sitemap


voorbeeld tekst rondom een afbeelding

wrap tekst Als je tekst om een plaatje heen wilt "draperen", kan je een "float" hiervoor gebruiken. Als je (in de stylesheet) :left toevoegt, zal de tekst aan de rechterkant van het object geplaatst worden, bij een :right is dat aan de linkerkant. Kijk even naar de html-code en de stylesheet, en maak jouw eigen versies van het "tekst-wrap gebeuren".

stylesheet tekst wrap


<style type="text/css">
        .wrap-tekst{
                float:left;
                padding:0 8px 8px 0}
        .clear-both{
                clear:both}
        .wrap-voorbeeld{
                width:400px}    
</style>

html code tekst-wrap


<p class="wrap-voorbeeld">
        <img class="wrap-tekst" src="wrap.jpg" alt="wrap tekst" width="120" height="120" />
        Als je tekst om een plaatje heen wilt "draperen", kan je een "float" hiervoor gebruiken. 
        Als je (in de stylesheet) <em>:left</em> toevoegt, zal de tekst aan de rechterkant van 
        het object geplaatst worden, bij een <em>:right</em> is dat aan de linkerkant. 
        Kijk even naar de html-code en de stylesheet, en maak jouw eigen versies van het 
        "tekst-wrap gebeuren".
</p>
<h4 class="clear-both">stylesheet tekst wrap</h4>
Gebruik voor alle voorbeelden op de http://kompoos.nl een valide html5 pagina.