Mettre une photo en fond d'article (ou de module)

Pour décorer vos articles, il est simple de mettre des images en fond.

Pour cela, suivez la procédure :


1. Enregistrer sa photo

Après avoir choisi la photo à mettre en fond d'article, enregistrez là dans vos documents et notez son adresse URL.


2. HTML

Passer en mode HTML dans votre article, en cliquant sur l'onglet "édition avancée",
puis sur le bouton HTML à gauche dans la barre de menu.


3. Syntaxe du code


Ajouter en tout début de code :

<div style="background-image:url(URL_image); width: 100%; height: 100%">

et remplacer URL_image par l'adresse de votre image.

Ajouter tout en fin de code :

</div>

4. Exemple :


Pour insérer cette photo, j'ai écrit au tout début de mon code HTML de cet article : 

<div style="background-image: url(http://idata.over-blog.com/2/07/78/33/Mes-photos/Mes-photos_0512_800x600.jpg); width: 100%; height: 100%;">

et à la fin :
</div>


 Attention à la lisibilité de votre article ! N'oublieze pas de garder un bon contraste entre le fond et le texte, ce qui n'est pas toujours facile avec une photo !

---

Comments

[sp05]

 


bonjour,


super site bien pratique pour un néophite comme moi, par contre je n'arrive pas a voir l'image en fond d'ecran alors qu'elle est visible sur la page en cours de modification.


cordialement patrick

[Aurelie]

2 possibilités : ou bien elle est trop grande, alors modifier sa "size" ; ou bien, votre hébergeur a censuré le coe, vérifiez une fois le code validé qu'il se trouve toujorus là.

[pakita]

Merci pour l'info, bien utile pour différencier certains billets.


 

[Missycornish]

Bonjour, je viens de découvrir ton blog et tu dois t'en douter si je suis arrivée jusqu'à toi c'est parce que je suis une quiche de l'informatique. Depuis hier matin je tente vainement de
comprendre comment mettre de la neige, de jolis flocons pour Noël sur mon blog artdelire.fr


ça me désespère, je voulais mettreces flocons:





ou cela:


src="http://ddata.over-blog.com/xxxyyy/0/09/23/80/flocons/snow.js"
type="text/javascript">


qui sont encore plus beaux.Mais voilà je sais pas comment faire, je suis sur overblog premium et je n'y comprend rien à rien à la
méthode qu'il faut employer pour mettre ses flocons.Je crois avoir compris qu'il fallait l'ajouter par la bannière derrière l'image même et grâce à un CSS. (pour te prouver à quel point je suis
nulle! je ne comprend pas ce qu'est le css). Y aurait-il un moyen de m'expliquer pas à pas, clairement les manipulations qu'il faut que je fasse (sans endommager ma bannière, j'ai peur qu'elle
disparaisse) pour réussir à mettre ses flocons?Je te remercie d'avance de tout coeur pour ton aide. Promis ton logo sera sur mon blog mais par pitié pour cette quiche de missycornish, aide-moi
s'il te plaît!

[Aurelie]

Ne touche pas au CSS, c'est trop dangereux, surtout quand on est débutant. Vas dans ton administration/MIse en page puis marteau sur un module puis bouton CSS.


Et lis ça avec attention :


http://faireunblog.over-blog.com/article-html-c-est-quoi--39086603.html

[Moïsette]

Bonjour


C'est fait votre logo sur mon blog et un ami a également mis votre lien dans une article d'astuces


Merci pour votre aide et, j'en aurai peut-être encore besoin


Bon après-midi

[Aurelie]

merci a vous !

[Moïsette]

Bonjour et merci, j'ai réussi hier soir et même dans mes réponses aux commentaires


Je vais revenir pour mettre votre logo et lien sur mon blog, cela pourra servir à d'autres. Pas trop le temps, je suis mamie et le mercredi, j'ai des petits-enfants


Bonne journée

[Aurelie]

Bravo à vous et merci par avance

[Moïsette]

Bonjour et bravo pour votre blog


J'ai essayé le fond de page pour un article, j'ai bien l'adresse de mon image et je n'ai pas oublié le à la fin, cela m'insère bien mon image mais, pas en fond, car je ne peux pas
écrire dessus


Je vais continuer de parcourir votre blog


Bonne journée

[Aurelie]

Si si, votre image est en fond, mais on ne voit peut être pas votre curseur quand vous essayez de taper votre texte. Insérez le quand même, mais d'une couleur quit ranche sur le fond pour qu'il
se voit. Bon blog !

[délégation- provinciale- driouch]

je vous remercier beaucoup . cest tres interessant.jespere avoir de tes truc pour devlopement

[T.S.A.R]

merci pour toute l aise apporter voila un petit liens rajouter sur mon blog pour vous

[Korrigane-Bleue]

Bonjour,


Je voulais mettre mon texte avec l'image et une musique. je ne sais pas comment avoir les deux ; j'avais quelque chose au début, mais tout a fichu le camp et j'ai fait autrement en
attendant.Merci.

[Linda & Picasso ::0079::0071::]

merci de ces indications!


gros bisous et belle soirée +$