Texte formaté normalement suivant code HTML
Texte formaté avec positionnement absolu
Avec ce type de positionnement qui est le plus rencontré, le placement
d'un objet consiste à créer une boîte indépendante
du reste du contenu de la page, dans laquelle on place du texte ou des images.
Il se trouve très souvent utilisé car il est le plus précis
et on obtient d'excellents résultats. Ce positionnement est déterminé
par rapport au coin supérieur gauche de la fenêtre du navigateur.
Exemple 1 : Boîte à l'état brut, sans padding, ni border ni margin.
Texte formaté avec positionnement absolu et background-color
Avec ce type de positionnement qui est le plus rencontré, le placement
d'un objet consiste à créer une boîte indépendante
du reste du contenu de la page, dans laquelle on place du texte ou des images.
Il se trouve très souvent utilisé car il est le plus précis
et on obtient d'excellents résultats. Ce positionnement est déterminé
par rapport au coin supérieur gauche de la fenêtre du navigateur.
Exemple 2 : Boîte à l'état brut, sans padding, ni border ni margin. Une couleur pour bien visualiser que la boîte correspond juste au texte.
Code de cette page entre <HEAD> et </HEAD>
<style type="text/css">
body
{
text-align:justify ;
font-family: arial, verdana, trebuchet MS,sans-serif ;
font-size: 10pt ;
color: black ;
background-color: #FFFFFF ;
}
.un
{ position:absolute ;
left:30px ;
top:550px ;
font-family: Verdana, Arial, Helvetica, sans-serif ;
font-size: 10pt ;
color: #000000 ;
width:92% ;
}
.deux
{ position:absolute ;
left:30px ;
top:765px ;
font-family: Verdana, Arial, Helvetica, sans-serif ;
font-size: 10pt ;
color: #000000 ;
background-color: #FFFF00 ;
width:92% ;
}
</style>
Code appliqué aux paragraphes dans BODY
<p class="un"><b>Texte ......... </p>
<p class="deux"><b>Texte ......... </p>
