Quelques attributs ajoutés à la règle "#Contenu h3"


En mauve sur l'image

 

 

 

DizPerso Partie "Contenu > titres"

 

Nom de l'attribut Nom CSS Valeur Valeurs possibles
Couleur de fond background Choisir  
Image de fond background-image Adresse d'une image (clic droit>propriétés sur une image)
Répetition de l'image de fond background-repeat Dépend de l'image de fond
Couleur du texte color Choisir  
Largeur width Dimension en pixels (ex : 200px)
Hauteur height Dimension en pixels (ex : 200px)
Marge intérieure gauche padding-left Dimension (ex: 10px)
Marge intérieure droite padding-right Dimension (ex: 10px)
Marge extérieure haute margin-top Dimension (ex: 10px)
Marge extérieure gauche margin-left Dimension (ex: 10px)
Marge extérieure droite margin-right Dimension (ex: 10px)
Marge extérieure basse margin-bottom Dimension (ex: 10px)
Taille de la police font-size ex: 10pt
Famille de la police font-family ex: Arial, Verdana, Trebuchet MS


Code CSS de la partie Contenu > titres


#contenu h3
{
background : #000000;
background-image : //;
background-repeat : repeat;
color : #E8EEF4;
width : 457px;
height : 25px;
padding-left : 15px;
padding-right : 50px;
margin-top : 10px;
margin-left : 10px;
margin-right : 10px;
margin-bottom : 15px;
font-size : 15px;
font-family : Trebuchet MS;
}

 

Cette règle gére le titre de page, positionné en haut de la partie "Contenu", par défaut comme sur cette page, le fond est noir et le texte gris clair. Les sections "Commentaires" et "Liens" sont également gérés par la même règle, voir dans "Astuces" ci-dessous comment employer ce format de titre dans vos articles.
Vous pouvez changer les couleurs du fond background et du texte color. Vous pouvez aussi modifier la largeur width en tenant compte de la largeur du Contenu et la hauteur height pour pouvoir mettre du texte de plus grande taille font-size.

 

J'ai rajouté la possibilité de mettre un fond-image background-image, comme vous pouvez agrandir cette barre de titre, il est intéressant d'y insérer une image, une mini bannière, etc... je vous laisse imaginer toutes les possibilités.

 

Je ne reviens pas sur les marges interieures et extérieures, voir article sur le "Contenu", je ferai certainement un exemple en les employant, également pour les bordures avec d'autres styles non gérés par DizPerso, avec un peu de code HTML...

 


 

Astuces

Dans vos articles, si vous créez des sections, en mode HTML utilisez la balise de titre de cette façon <H3>votre titre</H3>, comme je le fais pour "Astuces", votre page sera plus homogène.

 

Liste des Astuces

 



23/05/2008
0 Poster un commentaire

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 42 autres membres


Rechercher sur Diztest ? :

Recommander ce blog | Contact | Signaler un contenu | RSS | Espace de gestion

retour Accueil Page precedente Bas de page Plein ecran - Retour alt+F4 Haut de page Page suivante Envoyer un mail a PapyClic le webmaster de Test-DizPerso