ICI header("Location: http://www.mytesting.fr ");
TESTS ET ASTUCES DE BLOGUEUR

COMMENT FAIRE UNE BELLE PRESENTATION DU SOMMAIRE D'UN SITE.

par André Marini 20 Décembre 2014, 10:47 Blogs

COMMENT FAIRE UNE BELLE PRESENTATION DU SOMMAIRE D'UN SITE.

Voici un exemple de code html pour faire un sommaire actif.

 

En <h1></h1> on écrit "LE TITRE DU SITE" puis en <h2></h2> on écrit "SOMMAIRE".

 

On peut ainsi allonger la liste avec <h3></h3> et <h4></h4> ....etc

 

Ensuite, entre les balises <p> et </p> on écrit le lien de chaque thème suivi de son intitulé.

 

Le footer ou "pied" est facultatif.

 

Il permet d'écrire le nom de l'auteur ou tout autre chose.

 

L'avantage de cette présentation est la forme tableau qui s'intègre parfaitement dans un module.

CODE

<article>
<header style="border-top:dotted 2px silver; border-bottom:solid 2px grey;">
<hgroup>
<h1 style="font-size:16px; border:none;">LA PECHE EN SEINE-ET-MARNE</h1>
<h2 style="font-size:14px;">SOMMAIRE</h2>
</hgroup>
</header>
<p><a href="http://www.pecheurdumorin.fr/tag/la%20peche%20au%20vif/">LA PECHE AU VIF</a></p>
<p><a href="http://www.pecheurdumorin.fr/tag/la%20peche%20au%20leurre/">LA PECHE AU LEURRE</a></p>
<p><a href="http://www.pecheurdumorin.fr/tag/la%20peche%20au%20quiver%20et%20au%20feeder/">LA PECHE AU FEEDER</a></p>
<p><a href="http://www.pecheurdumorin.fr/tag/la%20peche%20a%20la%20plombee,%20a%20fond/">LA PECHE A LA PLOMBEE</a></p>
<footer style="border-top:solid 2px grey; border-bottom:dotted 2px silver;">Proposé par André MARINI</footer>
</article>

RESULTAT

On peut aussi remplacer le titre du chapitre par une photo éditée.

 

CODE

 

<article>
<header style="border-top:dotted 2px silver; border-bottom:solid 2px grey;">
<hgroup>
<h1 style="font-size:16px; border:none;"><br />
LA PECHE EN SEINE-ET-MARNE<br />
&nbsp;</h1>
<h2 style="font-size:14px;">SOMMAIRE<br />
&nbsp;</h2>
</hgroup>
</header>
<p><a href="http://www.pecheurdumorin.fr/tag/la%20peche%20au%20vif/"><img src="http://img.over-blog-kiwi.com/1/30/51/51/20141228/ob_0861d3_vif.jpg" />LA PECHE AU VIF</a></p>

<p>&nbsp;</p>

<p>&nbsp;</p>
<p>&nbsp;</p>
<p><a href="http://www.pecheurdumorin.fr/tag/la%20peche%20au%20leurre/"><img src="http://img.over-blog-kiwi.com/1/30/51/51/20141228/ob_7ed855_leurre.jpg" />LA PECHE AU LEURRE</a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><a href="http://www.pecheurdumorin.fr/tag/la%20peche%20au%20quiver%20et%20au%20feeder/"><img src="http://img.over-blog-kiwi.com/1/30/51/51/20141228/ob_263f9b_feeder.jpg" />LA PECHE AU FEEDER</a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><a href="http://www.pecheurdumorin.fr/tag/la%20peche%20a%20la%20plombee,%20a%20fond/"><img src="http://img.over-blog-kiwi.com/1/30/51/51/20141228/ob_580ce9_fond.jpg" />LA PECHE A LA PLOMBEE</a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<footer style="border-top:solid 2px grey; border-bottom:dotted 2px silver;">
<p>&nbsp;</p>
<p><span style="font-size:16px;"><strong><span style="color:#0000CD;">Propos&eacute; par Andr&eacute; MARINI</span></strong></span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</footer>
</article>
 

.

commentaires

Y
Yann
06/01/2021 17:17
un bel exemple de ce qu'il ne faut pas faire :/<br /> <br /> un sommaire est une liste, il faut donc utiliser les balises (ou ) et . les balises utilisées doivent refléter la structure du document, les fonctions doivent correspondre.<br /> <br /> pour créer un espace on utilise du css et non des paragraphes avec un espace insécable !<br /> <br /> je ne dis pas ça pour critiquer mais pour éviter à d'éventuels lecteurs de suivre ces mauvais conseils, cordialement.

Haut de page

Theme: Autofocus © 2013 - Hébergé par Overblog