MODELES GRAPHIQUES

<div id="menugauche">

Bloc menu vertical

Mdl Graph id "menugauche" >>> CSS  #menugauche >>>  DizPerso ID "menu" >>> CSS #menu

Tous les éléments HTML ci-dessous sont gérés dans la feuille de style de ce modèle par les règles commençant par #menugauche et qui correspondent aux règles commençant par #menu dans le DizPerso.

<ul>

<li><div id="menu_articles" class="menu_bloc">

<h2>Articles</h2>

<ul>

<li><a liens article ou categorie ">texte du lien</a></li>

<li><div id="menu_photos" class="menu_bloc">

<h2>Photos</h2>

<li><div id="menu_forum" class="menu_bloc">

<h2>Forum</h2>

<li><div id="menu_newsletter" class="menu_bloc">

<h2>Newsletter</h2>

<form action="newsletter-423868.html" method="post">

<input type="texte" size="15" name="adressemail" value="......"...>

<input type="submit" value="Go">

</form>

<a href="newsletter-423868.html">En savoir plus</a></li>

<li><a href="newsletter-archives-423868.html">Archives</a></li>

</ul>

Tout le code en vert ci-dessus, est commun dans tous les blogs, vous trouverez dans DizTest un article qui vous aidera pour mettre un style personnalisé à ces blocs.  lien

</div><!-- fin ID menugauche -->

<div id="contenu">

Bloc espace article, commentaires et liens.

Mdl Graph ID "contenu" >>> CSS #contenu >>>  DizPerso ID "contenu" >>> CSS #contenu

<div id="article" class="tiny">

<div id="article" class="tiny">
CSS >>> #article et .tiny
ces règles ne sont pas dans feuille de style de base

Bloc titre de l'article

<h3>Titre article</h3>

Mdl Graph >>>  CSS #contenu h3 >>> DizPerso >>> CSS #contenu h3

<p>Contenu de l'article, texte images, etc...</p>

</div><!-- fin #article -->

Statistiques article, gérées par le système.

<i>Article ajouté le date création , consulté XX fois</i>

<hr class="ligne_b4e"/>

Liens sociaux

Gestion de cette partie par le système, les modifications ne rentrent pas dans le cadre de cet article.

Bloc commentaires sur l'article

<div id="article_commentaires" class="contenu_commentaires">

Quand la fonction commentaires est activée, le bloc titre de section de page s'affiche, identique à celui du titre de l'article./p>

<h3>Commentaires</h3>

CSS >>>  #article_commentaires et .contenu_commentaires, ces règles ne sont pas dans feuille de style de base, voir mon article sur DizTest lien

Bloc formulaire de saisie des commentaires

<form formulaire ajout commentaire></form>

Mais pour ce formulaire il y a mieux à faire à l'aide des IDs et de règles à créer pour ça voir mon article sur DizTest lien

</div >
<!-- fin ID article_commentaires et CLASS contenu_commentaires -->

Bloc contenant le lien pour revenir à la catégorie de l'article

<div id="article_liens">

CSS >>> #article_liens, cette règle n'est pas dans feuille de style de base

Bloc titre de section de page, identique à celui du titre de l'article./p>

<h3>Liens</h3>

Mdl Graph >>> CSS #contenu h3 >>> DizPerso >>> CSS #contenu h3

</div><!-- fin ID article_liens -->

Règles de style à créer si nécessaire,#article_liens a et #article_liens a:hover pour :

Le lien >>> vers la catégorie

Le lien >>> Retour aux articles

<center> Emplacement Pub </center>

</div><!-- fin ID contenu -->

<div id="barre_bas">

Bloc barre des liens du bas de page

Ce bloc est inséré automatiquement par le système, il contient des liens obligatoires et d'autres très utiles aux internautes, donc il doit être visible en bas de chaque page.
Si vous souhaitez personnaliser ce bloc et les liens, en harmonie avec le design du blog, il vous faudra créer les règles suivantes dans votre feuilles de style.

#barre_bas
#barre_bas a
#barre_bas a:hoover

</div><!-- fin ID barre_bas -->