Profil

  • Christelle
  • retrouvez-moi sur : http://www.awerpi.fr
  • retrouvez-moi sur : http://www.awerpi.fr

Photo.Graph

Catégories

27 février 2008 3 27 /02 /février /2008 14:56
La question qui se pose rapidement lorsqu’on désire modifier le css de son blog, c’est comment modifier la couleur du fond ? Comment insérer une image ?
 
 
Cherchez dans votre css l’élément « body »
 
Vous trouverez quelque chose qui ressemble à ça :
body {margin:0px; padding:0px; background-color: #000000; background-image:url(http://www.monimage.jpg); color:#FFF; font-size:x-small;}
 
Vous remarquez qu’il y a deux propriétés qui portent le nom de background :
background-color : couleur d’arrière plan
background-image : image d’arrière plan qui vient se placer par dessus le background-color
 
Et si elles n’y sont pas ou qu’il en manque une, vous pouvez les ajouter. Pour éviter de faire des erreurs de syntaxe (comme par exemple oublier un point virgule), vous pouvez consulter l’article sur la syntaxe du css
 
 
La couleur d’abord :
Car même si vous avez une image en background, au chargement de la page il y aura un laps de temps sans image. La couleur du fond sera alors visible en arrière plan. Autant l’adapter au style du blog.
 
body {background-color:#... ;}
Pour définir la couleur, il suffit de placer un code hexadécimal (voir l’article : les codes hexadécimaux)
Par exemple vous voulez que la couleur de votre fond de page soit rouge, écrivez :
body {background-color:#CC0000 ;}
 
 
 
 
Modifier ou placer une image en arrière plan d’un blog :
 
Plusieurs astuces s’offrent à nous…
Votre blog design de base contient déjà une image de fond ? On va voir comment la modifier très simplement (l’exemple suivant utilise le design de base d’over-blog American Beauty grey).
Assurez-vous d’héberger votre image et d’avoir son url (du genre http://monsite/mesimages/image.jpg).
Placez votre souris sur l’image d’arrière plan de votre blog et faites un clic droit.

background

Allez sur « enregistrer l’arrière plan sous », une fenêtre va s’afficher, relevez le nom qu’elle contient (ici dans l’exemple, c’est « mosaique.png »).
 background
Rendez-vous sur votre CSS (avancé) et dans accueil faites F3 (vous savez les touches qui servent pas souvent en haut de votre clavier, sinon vous pouvez toujours rechercher manuellement en ouvrant grands les yeux) une fenêtre de recherche va s’ouvrir. Tapez « mosaique.png » (sans les guillemets) vous allez trouver où se trouve dans le css l’image de fond actuelle. Collez à la place de l'url existante celle de la nouvelle image. Cherchez deux fois (on sait jamais) si ça y est deux fois (c’est possible si le css n’est pas très clair) collez une nouvelles fois l’url de la nouvelle image.
Activez l'option "Je souhaite modifier et appliquer la feuille de style à mon blog" en cochant la croix. 

background

Enregistrez.  
Vous pouvez aussi ajouter au modifier les éléments dans body :
body {background-image:url(http://www.monsite.fr/mesimages/monimage.png);}
 
 
Et pour vérifier les modifications, on n’oublie pas de rafraîchir la page du navigateur, en faisant ctrl+F5...

Partager cet article

Repost 0
Published by Christelle Vinsonneau - dans webdesign
commenter cet article

commentaires

VIENS 03/09/2009 10:48

Oui, certainement à la prochaine.... car je m'y penche sur ce css...
Difficile de laisser des commentaires aujourd'hui... Normal ???
Bonne journée!

Christelle Vinsonneau 13/09/2009 15:23


les commentaires : sans doute un problème d'over-blog !


VIENS 29/08/2009 18:57

Re-bonjour,
J'ai cherché... fouiné.. vérifié... et finalement, j'ai trouvé l'erreur!
C'était un ":" qui s'était inséré (on se demande comment lol), mais je l'ai vu et je l'ai enlevé et le fond d'article est revenu...
Merci quand même et au plaisir, car je reviendrai, tes explications sont trés claires et faciles à comprendre.
Bisou!

Christelle Vinsonneau 02/09/2009 20:07


Et oui... un seul signe et plus rien ne fonctionne !
A la prochaine !


VIENS 29/08/2009 18:37

Bonjour,
Hé bien, je viens de passer une bonne partie de la journée sur ton blog, et j'ai l'impression de te connaitre (lol).
Je suis en train de refaire le design de mon blog, et... catastrophe, mon fond d'article à disparu, sauf sur global, et n'apparait donc plus sur le blog ????
Qu'ai-je donc fais qu'il ne fallait pas faire....
Merci d'avance pour ta réponse et à bientôt!
Help!

melodye 01/03/2008 11:41

je vais pt etre devenir une pro un jour! lol
enfin avt, il faut que je les mette en pratique tous ces conseils!!