La Feuille de style de nos BLOGS #3
Par FredLynx le jeudi 7 juin 2007, 08:41 - Personnalisation de la feuille de Style - Lien permanent
Troisième billet sur les feuilles de styles...
La preuve par l'exemple, dans ce billet pas de long discours, tout est dans le dossier à télécharger! Je me suis amusé à créer une feuille de style complète en repartant de zéro au format des blogs de RégionJob.
Ce ne fut pas une mince affaire, mais c'est fait, enfin pour la version 1 de cette feuille parce qu'il se pourrait qu'il y ait quelques petits soucis. Si vous rencontrez des vilains BUG, laissez moi un commentaire je corrigerais.
En deux mots :
- Téléchargez la pièce jointe à ce billet.
- Dézippez en gardant l'arborescence interne du dossier.
- Lancez le fichier html pour tester la feuille de style.
Pour l'installation sur les Blogs RégionJob reportez-vous à mon premier billet de la catégorie.
Bonne Journée et Bon Blog ! 
Oups j'oublié une petite capture d'écran !?
Commentaires
Une feuille de style! Excellent! On peut l'ajouter directement aux choix des internautes si tu es d'accord.
Pas de soucis, elle est la pour tous et toutes...
L'intérêt est aussi formateur puisque j'ai pris le temps d'y commenter la feuille de style (custom_style.css) en découpant en sections de la façon la plus parlante possible, enfin j'espère
Le découpage est le suivant :
- Config générale
- Style des trois bandeaux + entête + pied
- Style RégionJob (_rj.html)
- Style générale Sidebar
- Style widgets
- Style page principale
- Style page TAG
- Style commentaires & rétroliens
Bonsoir Fredlynx, en suivant tes conseils, j'ai personalisé la feuille de style de mon blog, il me reste un dernier soucis que je n'arrive pas à résoudre malgrè plusieurs essais.
Comment et surtout où dois je agir dans la feuille de style pour ajouter une marge de 5px aux titres de la sidebar et une marge de 10px aux textes sous ces fameux titres ? Merci
En deux mots pour les titres c'est la section:
....
padding: TOP RIGHT BOTTOM LEFT;
...
}
Tu joues avec ces valeurs pour décaler ton titre.
Pour les textes sous les titres je te conseille pour chaque section de les baliser avec <p> (au début ) et </p> (à la fin). Ensuite tu pouras changer les marges dans la section:
padding: TOP RIGHT BOTTOM LEFT;
}
Voili
Merci je regarde ça ce soir en revenant du boulot. J'avais touché a beaucoup de valeurs de type margin: ou padding: sans succès. Encore merci, et ... bonne route vers le sud-ouest
Je n'ai pas eu le courage d'attendre ce soir, ça marche super bien ! Merci
De rien