Quelques attributs ajoutés à la règle "#Contenu h3"
ACCUEIL <<< Partie "Contenu Titre" <<<
 |
 |
 |
 |
 |
 |
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 : http://;
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.
Commentaires