aide Accueil  |  Sommaire CSS  |  Créer sa page perso   |  Menu
www.aidenet.com

 

C S S
Feuilles de style

Positionnement absolu
de paragraphe (1)

Page - 36a
w3c


paragraphe en absolu

Texte formaté normalement suivant code HTML

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.

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:480px ;
font-family: Verdana, Arial, Helvetica, sans-serif ;
font-size: 10pt ;
color: #000000 ;
}
.deux
{ position:absolute ;
left:30px ;
top:670px ;
font-family: Verdana, Arial, Helvetica, sans-serif ;
font-size: 10pt ;
color: #000000 ;
background-color: #FFFF00 ;
}
</style>

Code appliqué aux paragraphes dans BODY

<p class="un"><b>Texte ......... </p>

<p class="deux"><b>Texte ......... </p>

 

Retour "positionnement absolu"

retour position absolue

Tous droits réservés © 1997 . aidenet.com

validator html