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:

Une frise avec 1 seule image qui se répete
Image iso - Guide
Comment imprimer un tableau excel sur une seule page - Guide
Comment agrandir une image - Guide
Acronis true image - Télécharger - Sauvegarde
Légender une image - Guide

2 réponses

Réponse 1 / 2

JooS Messages postés 2468 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 -.- ...

fanette26
19 nov. 2011 à 18:59

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.

Réponse 2 / 2

JooS Messages postés 2468 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 -.- ...

fanette26
19 nov. 2011 à 22:12

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 )

JooS Messages postés 2468 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;    
}

fanette26
20 nov. 2011 à 13:00

Ça marche !! : )
Merci pour tes conseils, ils m'ont été très utiles !

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?

SOS : Ma télé s'allume toute seule tous les matins à 3h --' ...

Changer l'orientation d'une seule diapo

code couleur associé a une image