Statistiques| Inscription| Espace privé
Développement Web
Accueil > XHTML > des blocs...
Le plan Les galeries
Dernière mise à jour :
vendredi 15 mai 2009
Contact
Webmestre
olivier ramos
ParamSPIP
Agenda
<<   Mai 2019   >>
Lu Ma Me Je Ve Sa Di
29 30 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 1 2



Le concept de blocs
On présente dans cette rubrique, les éléments associés aux balises génériques <div> ainsi que leur agencement.
 
 
 
 
Le concept de blocs
On présente dans cette rubrique, les éléments associés aux balises génériques <div> ainsi que leur agencement.
Le code
 
 
 
 
À titre de premier exemple, nous allons envisager une page qui est certainement l'une des plus simples qui soit. Elle permet néanmoins de mettre en évidence :
- le type block de la balise générique <div>,
- le fait que les éléments peuvent soit se succéder soit s'imbriquer.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">

<head>
<meta http-equiv="Content-Type" content="text/html ; charset=iso-8859-1" />
<title>Des blocs</title>
</head>

<body>

<div >webdev1</div>
<div >webdev2</div>
<div ><div >webdev4</div>webdev3 </div>
<div >webdev5</div>

</body>
 </html>
 
 
 
 
 
Le résultat
 
 
 
 
webdev1
webdev2
webdev4
webdev3
webdev5
 
 
 
 
 
La mise en évidence des blocs
 
 
 
 

Lorsque vous regardez le résultat précédent, vous constatez les différents retours à la ligne, mais l’imbrication et la structure des différents blocs n’apparaissent pas de façon évidente.

Pour pallier cette carence, on va leur rajouter une petite bordure comme suit :

webdev1
webdev2
webdev4
webdev3
webdev5