| Voir le sujet précédent :: Voir le sujet suivant |
| Auteur |
Message |
raphlight
frontpage mioche
|
 mettre une image par dessus une autre , Posté le: 30-09-2006 11:12 |
|
|
j'ai mis une image (du vert) sur mon site et j'aimerais en mettre une autre par dessus (gif animé avec un fond transparent) afin que l'on voit le gif animé avec le fond vert,
comment faire ?
merci d'avance
-raphlight- |
|
|
pagetronic
moderateur
 |
| mettre une image par dessus une autre , Posté le: 30-09-2006 13:06 |
|
|
| as tu un exemple? |
|
|
raphlight
frontpage mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 7:15 |
|
|
| non, c'est un site que j'ai pas encore mis en ligne, mais je vai en faire un d'exemple là, il sera là demain |
|
|
SIBELIUS
html mioche
 |
| mettre une image par dessus une autre , Posté le: 02-10-2006 9:38 |
|
|
Hello,
Le plus simple serait de mettre ton vert en image de fond d'un block (background-image) ou mieux, en couleur de fond (background-color); puis de placer ton image gif simplement dans ce bloc à l'aide de la balise <img> |
|
|
raphlight
frontpage mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 12:14 |
|
|
voilà, l'exemple:
http://raphlight.free.fr/exemple/exemple.html
merci d'avance
PS: pourrais-je avoir le code directement plutot que des explications? |
|
|
SIBELIUS
html mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 12:27 |
|
|
| raphlight a écrit: |
| PS: pourrais-je avoir le code directement plutot que des explications? |
Ce n'est pas vraiment dans ma philosophie : j'aime les forum pour leurs échanges de connaissance, pas pour faire le travail à la place des autres.
Ici, on peut très bien te donner les moyens d'y parvenir toi-même, sans t'apporter le code sur un plateau d'argent.
Cela t'apportera beaucoup plus 
Bref : par rapport à la méthode que je t'ai donnée, à quel moment cela pose-t-il un problème de compréhension ? |
|
|
raphlight
frontpage mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 12:42 |
|
|
[quote]Le plus simple serait de mettre ton vert en image de fond d'un block [/quote]
Je sais pas faire ca, je suis pas très très fort, c'est pour ca que je demandais le code mais si tu as un explication que je comprenne je veux bien la prendre
EDIT: je connais juste la balise <img src="..."> pour mettre une image |
|
|
SIBELIUS
html mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 12:48 |
|
|
OK, en fait tu as déjà fait la moitié du boulot lorsque je regarde ton code HTML :
| Code: |
| <p><img src="http://www.leconcombre.com/gotlib/gif-bin/gailuron-trans-02.gif"></p> |
Tu as :
- un bloc (l'élément <p> qui est un paragraphe)
- une image (l'élément img)
Si tu veux appliquer un arrière-plan à tous les éléments <p> de ta page HTML, il suffit de créer cette règle de style :
| Code: |
p {
background: green;
} |
Cette règle, tu vas la placer dans un fichier nommé styles.css et que tu vas appeler dans le <head> de ton code HTML :
Voilà comment faire :
http://www.tuteurs.ens.fr/internet/web/html/css.html
Tiens-nous au courant  |
|
|
raphlight
frontpage mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 12:50 |
|
|
| ah ok, j'ai entendu parler du css, je vais lire le tuto et je vous tiendrais au courant! |
|
|
SIBELIUS
html mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 12:51 |
|
|
| raphlight a écrit: |
| ah ok, j'ai entendu parler du css |
Ah oui tu vas en avoir besoin puisque toute la mise en page passe par là si tu veux plus tard te faciliter les choses |
|
|
raphlight
frontpage mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 15:38 |
|
|
j'ai mis le code que tu m'a donné, mais ca fait le vert sur toute la ligne et pas que pour les dimensions de l'image, comment faire?
j'ai actualisé l'exemple, j'ai mis le résultat sur la meme adresse:
http://raphlight.free.fr/exemple/exemple.html |
|
|
SIBELIUS
html mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 15:46 |
|
|
Tu dois ensuite donner une largeur à ton paragraphe
exemple :
p {
background: ....;
width: 300px;
} |
|
|
raphlight
frontpage mioche
|
| mettre une image par dessus une autre , Posté le: 02-10-2006 19:31 |
|
|
| waii cool, merci j'ai réussi à faire ce que je voulais dans l'exemple, je vais pouvoir le reproduire dans le vrai site, merci beaucoup SIBELIUS, c'est super le css |
|
|
SIBELIUS
html mioche
|
| mettre une image par dessus une autre , Posté le: 03-10-2006 8:38 |
|
|
| De rien, ravi d'avoir pu être utile |
|
|
|
S'enregistrer
Profil
Se connecter pour vérifier ses messages privés
Rechercher
Membres
FAQ
Connexion
