24 août 2010

(OverBlog) Mettre un fond dans la colonne des articles

Selon la structure de votre blog, la colonne des articles n'a pas le même nom dans le CSS. Vous sélectionnez donc d'abord le nom de la colonne concernée :



Puis, vous allez dans le CSS : Design > Mode CSS
S'il s'agit de votre première modification de design, cochez Appliquer ma feuille de style personnalisée, enregistrez puis complétez cette ligne avec ce qui est en rouge :

Pour mettre une couleur en fond
#cl_1_0 {background-color: #800080;}
#cl_1_1 {background-color: #800080;}
Si vous ne connaissez pas les codes couleur, regardez cet article

Pour mettre une texture carrée qui se répète horizontalement et verticalement
#cl_1_0 {background-image:URL(adresse de la texture);}
#cl_1_1 {background-image:URL(adresse de la texture);}
Pour mettre une grande photo qui ne se répète pas, qui est centrée et fixe (on évite de le faire, trop difficile à gérer)
#cl_1_0 {background-image: url(adresse de l'image);background-repeat:no-repeat;background-position:center;background-attachment:fixed;}
#cl_1_1 {background-image: url(adresse de l'image);background-repeat:no-repeat;background-position:center;background-attachment:fixed;}
Vous avez dû remarquer que le fond descendait jusqu'au dernier article et non jusqu'en bas du blog. Si tel est votre désir, vous devez créer une texture rectangulaire qui se répète seulement verticalement. Selon ce modèle :


et la mettre dans cette ligne de CSS :
#ln_1 {background-image:URL(adresse de la texture);background-repeat:repeat-y;}
qui englobe la totalité des colonnes articles et modules.

Pour connaître les différents fonds possibles : découvrir les background

Après vos modifications, pensez à
  • enregistrer
  • faire CTRL+F5 sur le blog pour écraser le cache et voir les changements à l'écran

1 commentaire:

1/ Choisissez Nom/URL comme profil pour poster, si vous hésitez
2/ Si vous désirez une aide personnalisée, pensez à laisser l'adresse de votre blog, ce qui me permettra de tester.
3/ Vous pouvez vous abonner par email pour suivre les réponses de cet article (lien sous la zone de rédaction du commentaire)