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 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
samedi 15 novembre 2008
par olivier ramos
À 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
samedi 15 novembre 2008
par olivier ramos
webdev1
webdev2
webdev4
webdev3
webdev5
La mise en évidence des blocs
dimanche 16 novembre 2008
par olivier ramos

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