Une frise avec 1 seule image qui se répete

Résolu/Fermé
fanette26 - 19 nov. 2011 à 14:28
 fanette26 - 20 nov. 2011 à 13:00
Bonjour,

Je fais du html et j'aurai aimé savoir comment faire une frise dans la largeur avec une seule photo, un gif animé. C'est à dire faire répéter une même image de façon à obtenir une bande de cette image dans la largeur et situé en haut de ma page html.
Je ne sais pas si ma question est clair mais je vous remercie par avance pour votre aide.
A voir également:

2 réponses

JooS Messages postés 2465 Date d'inscription mardi 22 janvier 2008 Statut Membre Dernière intervention 8 juin 2016 228
Modifié par JooS le 19/11/2011 à 18:11
Salut ...

Répéter une image, c'est faisable avec du CSS !!

background-image:url('image.png');  
background-repeat:repeat-x; /*pour répéter horizontalement */  
background-repeat:repeat-x; /*pour répéter verticalement */


Mettez en résolu quand c'est résolu -.- ...
0
Sur ma feuille de style ça donne :

background-image: <img src="../images/chevalanime.gif">;
background-repeat:repeat-x;
Mais ça ne fonctionne pas. J'ai fais une erreur?
Sachant que j'ai déjà un fond d'écran sur mon CSS mais je voudrais que la frise soit juste sur la partie supérieure de la page.
0
JooS Messages postés 2465 Date d'inscription mardi 22 janvier 2008 Statut Membre Dernière intervention 8 juin 2016 228
Modifié par JooS le 19/11/2011 à 19:51
non non, ça <img src="../images/chevalanime.gif">, c'est du html, il faut que tu utilise celui que j'ai poster, or du CSS ...
background-image:url('../images/chevalanime.gif');

ça depend de ton code html(de la structure de tes pages), si par exemple tu as une balise div dont l'id est header, et qui represente la partie superieur de ta page ...
alors dans le CSS, tu fait ...

#header {   
background-image:url('../images/chevalanime.gif');   
background-repeat:repeat-x;    
}

Mettez en résolu quand c'est résolu -.- ...
0
a ok! Par contre sur ma page html, pour représenter ma partie supérieur j'ai mis :
<div class="header">
Mais il manque quelque chose non ? (Je sais je suis une cata en html... lol )
0
JooS Messages postés 2465 Date d'inscription mardi 22 janvier 2008 Statut Membre Dernière intervention 8 juin 2016 228
Modifié par JooS le 19/11/2011 à 23:10
alors au lieux du diese # tu mets un point !!!

.header {    
background-image:url('../images/chevalanime.gif');    
background-repeat:repeat-x;     
}


Sinon, tu ajoute a la balise un id, et tu l'utilise, tout simplement ...
<div class="header" id="blabla">

#blabla{   
background-image:url('../images/chevalanime.gif');   
background-repeat:repeat-x;    
}
0
Ça marche !! : )
Merci pour tes conseils, ils m'ont été très utiles !
0