Comment changer l’image de fond d’une template ?

Il existe en HTML (language CSS plus exactement, plusieurs fonctions permettant de gérer les images de fond.

- background-image : permet de spécifier une image d’arrière plan.
Ex :
td.leftside {
background-image: url(http://www.vivelesrondes.com/images/templates/fond.jpg);
}

- background-color: permet de définir la couleur du fond (pratique en cas d’indisponibilité de l’image par exemple)
Ex:
td.leftside {
background-image: url(http://www.vivelesrondes.com/images/templates/fond.jpg);
background-color: #FFFFFF ;
}

Pour obtenir le code hexadecimal d’une couleur, rapportez vous au topic suivant
http://www.vivelesrondes.com/forum/viewtopic_20500.htm

- background-position: permet de gérer le positionnement de l'image et peut prendre différent paramètres. 1er paramètre : right ou center ou left (droite, milieu, gauche). 2ème paramètre : top ou center ou bottom (haut, milieu, bas)
Ex :
td.leftside {
background-image: url(http://www.vivelesrondes.com/images/templates/fond.jpg);
background-color: #FFFFFF ;
background-position:center center;
}

- background-attachment: permet de fixer l'image de fond sur la page, le texte défile au dessus sans que l'image ne bouge
Ex :
td.leftside {
background-image: url(http://www.vivelesrondes.com/images/templates/fond.jpg);
background-color: #FFFFFF ;
background-position:center center;
background-attachment:fixed;
}

- background-repeat: permet de gérer le nombre de répétition de l’image dans la page.
no-repeat: une seule occurrence de l'image
repeat: l'image sera répété sur toute la page
repeat-x : l'image sera répété uniquement sur une ligne
repeat-y: l'image sera répété uniquement sur une colonne
Ex :
td.leftside {
background-image: url(http://www.vivelesrondes.com/images/templates/fond.jpg);
background-color: #FFFFFF ;
background-position:center center;
background-attachment:fixed;
background-repeat: no-repeat;
}


Astuce : pour pouvoir rapidement rajouter une image de fond séparé du texte (comme une bannière par exemple)
padding-top : permet de laisser une marge avant l'affichage du texte
Ex :
td.leftside {
background-image: url(http://www.vivelesrondes.com/images/templates/fond.jpg);
background-color: #FFFFFF ;
background-position:center center;
background-attachment:fixed;
background-repeat: no-repeat;
padding-top: 200px;
}


px = pixel.
L’idéal est de prévoir une hauteur légèrement supérieure à celle de l’image

Et voilà pour l'instant!

Génial, merci, postité !

ma Leez, tu es génial.....

toutes ces explications sont surement trés explicites pour une personne ayant un niveau normal en informatique...seulement je suis au niveau zéro moi!!! ](*,)

je n'arrive même pas a mettre une photo!

pitiéééé aidéé moi! lol

anaera a écrit :toutes ces explications sont surement trés explicites pour une personne ayant un niveau normal en informatique...seulement je suis au niveau zéro moi!!! ](*,)

je n'arrive même pas a mettre une photo!

pitiéééé aidéé moi! lol

Tu veux mettre une de tes photos dans ton blog, c'est ça?

exactement !!!

je vai dans parcourir, je choisit ma photo et quand je clique pour les ajouter il n'y a aucune réaction !

au secours !!!!! help me !!!!! alors moi j ai bien une reaction mais ma photo est super super grande :shocked!: comment faire pour qu elle soit "normal" ? je precise que je suis harchi nul et c est aussi pour mettre autre chose que des mots sur mon blog et mettre un visage sur un nom

besoin d'aide pour mettre mon avatar ..qui peut m'aider ??

salut moi aussi un soucis je peux plus mettre de photo cela me dit ce surclaser mon blog j'ai retaille beaucoup plus petit mes photos et je peux toujours pas en mettre que faire merci

il te suffit d'envoyer un mail à contact at vivelesrondes.com en demandant qu'on t'augmente ton espace de stokage... c'est écrit tout en faut de ta page image

Pour l'avatar il suffit de faire une recherche dans le moteur de VLR, il y a plusieurs posts qui en parlent

Sinon vous pouvez toujours faire héberger vos photos ailleurs comme picasa et les utiliser dans vos notes puisqu'on obtient une adresse de l'image.