Ajouter une image en bas de page répéter horizontalement
Fermé
ReouvK
Messages postés
3
Date d'inscription
lundi 12 novembre 2012
Statut
Membre
Dernière intervention
12 novembre 2012
-
12 nov. 2012 à 13:01
inspiring Messages postés 1813 Date d'inscription vendredi 28 janvier 2011 Statut Membre Dernière intervention 31 décembre 2018 - 13 nov. 2012 à 10:33
inspiring Messages postés 1813 Date d'inscription vendredi 28 janvier 2011 Statut Membre Dernière intervention 31 décembre 2018 - 13 nov. 2012 à 10:33
A voir également:
- Ajouter une image en bas de page répéter horizontalement
- Supprimer une page word - Guide
- Traduire une page web - Guide
- Créer une page facebook - Guide
- Image iso - Guide
- Page d'accueil iphone - Guide
4 réponses
inspiring
Messages postés
1813
Date d'inscription
vendredi 28 janvier 2011
Statut
Membre
Dernière intervention
31 décembre 2018
265
12 nov. 2012 à 15:04
12 nov. 2012 à 15:04
en CSS
je ne vois pas trop comment est fait ton code et si l'image est dans le formulaire ou juste en bas de page html
pour exemple , dans une div (que tu place ou tu veux)
<div style="height: la hauteur de ton image en px; width: la largeur voulu en px ou %; background-image:url de ton image; background-repeat:repeat-x;"></div>
c'est le CSS pour l'effet voulu, dans la balise ou en feuille externe, a toi de retravailler ca
ou colle ton bout de code et précise l'endroit ou te veux cette effet, je verrai
je ne vois pas trop comment est fait ton code et si l'image est dans le formulaire ou juste en bas de page html
pour exemple , dans une div (que tu place ou tu veux)
<div style="height: la hauteur de ton image en px; width: la largeur voulu en px ou %; background-image:url de ton image; background-repeat:repeat-x;"></div>
c'est le CSS pour l'effet voulu, dans la balise ou en feuille externe, a toi de retravailler ca
ou colle ton bout de code et précise l'endroit ou te veux cette effet, je verrai
ReouvK
Messages postés
3
Date d'inscription
lundi 12 novembre 2012
Statut
Membre
Dernière intervention
12 novembre 2012
1
12 nov. 2012 à 15:54
12 nov. 2012 à 15:54
Tout d'abord merci de ta réponse "inspiring" !
Voici mon code HTML :
<!DOCTYPE html>
<html>
<head>
<title> Formulaire - Projet </title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<h1> Inscrivez votre projet </h1>
<form method="post" action="valid.php">
<fieldset>
<legend>Vos Coordonnées</legend>
<table>
<tr>
<td>Numéro d'Etudiant *:</td>
<td> <select> </select></td>
</tr>
<tr>
<td>Nom *:</td>
<td><input type="text" name="nom_eleve"/></td>
</tr>
<tr>
<td>Prénom *:</td>
<td><input type="text"name="prenom_eleve"/></td>
</tr>
<tr>
<td>Age *:</td>
<td><input type="text" name="age_eleve"/></td>
</tr>
</table>
</fieldset>
<br>
<fieldset>
<legend>Classe & Type de Formation</legend>
<table>
<tr>
<td>Séléctionnez votre classe *:</td>
<td><input type="radio" name="id_eleve" value="1"/>SIO 1 DEV</td>
<td><input type="radio" name="id_eleve" value="2"/>SIO 1 RES</td>
<td><input type="radio" name="id_eleve" value="3"/>SIO 2 DEV</td>
<td><input type="radio" name="id_eleve" value="4"/>SIO 2 RES</td>
</tr>
<tr>
<td>Quel est votre statut ? *:</td>
<td><input type="radio" name="formation" value="1"/>Classique</td>
<td><input type="radio" name="formation" value="2"/>Alternance</td>
</tr>
</table>
</fieldset>
<br>
<fieldset>
<legend>Concernant votre projet :</legend>
<table>
<tr>
<td>Numéro de votre projet *:</td>
<td><input type="text" name="num_projet"/></td>
</tr>
<tr>
<td>Nom du Projet *:</td>
<td><input type="text" name="nom_projet"/></td>
</tr>
<tr>
<td>Decrivez votre projet *:</td>
<td><textarea cols="50" rows="10" name="projet"></textarea></td>
</tr>
</table>
</fieldset>
<br>
<input class="bouton" type="reset" value="Annuler" />
<input class="bouton" type="submit" value="Enregistrer" />
</form>
</body>
</html>
et je souhaiterai que l'image attérise en bas de page.
Merci d'avance
Voici mon code HTML :
<!DOCTYPE html>
<html>
<head>
<title> Formulaire - Projet </title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<h1> Inscrivez votre projet </h1>
<form method="post" action="valid.php">
<fieldset>
<legend>Vos Coordonnées</legend>
<table>
<tr>
<td>Numéro d'Etudiant *:</td>
<td> <select> </select></td>
</tr>
<tr>
<td>Nom *:</td>
<td><input type="text" name="nom_eleve"/></td>
</tr>
<tr>
<td>Prénom *:</td>
<td><input type="text"name="prenom_eleve"/></td>
</tr>
<tr>
<td>Age *:</td>
<td><input type="text" name="age_eleve"/></td>
</tr>
</table>
</fieldset>
<br>
<fieldset>
<legend>Classe & Type de Formation</legend>
<table>
<tr>
<td>Séléctionnez votre classe *:</td>
<td><input type="radio" name="id_eleve" value="1"/>SIO 1 DEV</td>
<td><input type="radio" name="id_eleve" value="2"/>SIO 1 RES</td>
<td><input type="radio" name="id_eleve" value="3"/>SIO 2 DEV</td>
<td><input type="radio" name="id_eleve" value="4"/>SIO 2 RES</td>
</tr>
<tr>
<td>Quel est votre statut ? *:</td>
<td><input type="radio" name="formation" value="1"/>Classique</td>
<td><input type="radio" name="formation" value="2"/>Alternance</td>
</tr>
</table>
</fieldset>
<br>
<fieldset>
<legend>Concernant votre projet :</legend>
<table>
<tr>
<td>Numéro de votre projet *:</td>
<td><input type="text" name="num_projet"/></td>
</tr>
<tr>
<td>Nom du Projet *:</td>
<td><input type="text" name="nom_projet"/></td>
</tr>
<tr>
<td>Decrivez votre projet *:</td>
<td><textarea cols="50" rows="10" name="projet"></textarea></td>
</tr>
</table>
</fieldset>
<br>
<input class="bouton" type="reset" value="Annuler" />
<input class="bouton" type="submit" value="Enregistrer" />
</form>
</body>
</html>
et je souhaiterai que l'image attérise en bas de page.
Merci d'avance
astuces72
Messages postés
7723
Date d'inscription
vendredi 15 janvier 2010
Statut
Membre
Dernière intervention
22 avril 2024
1 637
12 nov. 2012 à 16:20
12 nov. 2012 à 16:20
slt
tu n'utilises pas de css, et c'est pourtant la solution à retenir.
en html tu ne peux pas répéter une image sans qu'elle soit en backgroud.
après il faut bidouiller avec du php et une boucle while($a < 10) mais c'est bien nase.
toutes la largeur de ton site cette image ?
tu n'utilises pas de css, et c'est pourtant la solution à retenir.
en html tu ne peux pas répéter une image sans qu'elle soit en backgroud.
après il faut bidouiller avec du php et une boucle while($a < 10) mais c'est bien nase.
toutes la largeur de ton site cette image ?
inspiring
Messages postés
1813
Date d'inscription
vendredi 28 janvier 2011
Statut
Membre
Dernière intervention
31 décembre 2018
265
Modifié par inspiring le 13/11/2012 à 10:34
Modifié par inspiring le 13/11/2012 à 10:34
OK, merci pour le code
Je pars sur le principe que l'image est sous ton champ <form>
Le principe, une <div> avec un peu de CSS :
Directement dans le body: ...
</form>
<div style="background-image:url(chemin de ton image.jpg ou png); background-repeat:repeat-x; width:100%; height:la hauteur de ton image en px;"></div>
Avec CSS en <head> et div en <body> : <head>
...
<style type="text/css">
#basdepage {
background-image:url(tst.JPG);
background-repeat:repeat-x;
width:100%;
height:128px; }
</style>
</head>
<body>
...
</form>
<div id="basdepage"></div>
</body>
</html>
Voilà, maintenant tu as plusieurs possibilités :
tu peux placer cette <div> dans un conteneur ou en bas de page ou dans un tableau, celà ne change rien au code sauf pour la largeur qui ne prendra pas toute la page mais celle du conteneur
Si tu veux décaler un peu ce bandeau du bas de ton formulaire (là il est juste en dessous), tu ajoute margin-top:100px; au code css. J'ai mis 100px mais tu détermine la valeur que tu veux.
C'est du CSS, si tu veux ajouter un texte par dessus ce bandeau d'image, tu peux écrire dans la balise <div>
Si besoin dis moi s'il y à un probleme ou si tu veux une modification du code (je ne sais pas ce que tu souhaite au final ...)
Je pars sur le principe que l'image est sous ton champ <form>
Le principe, une <div> avec un peu de CSS :
Directement dans le body: ...
</form>
<div style="background-image:url(chemin de ton image.jpg ou png); background-repeat:repeat-x; width:100%; height:la hauteur de ton image en px;"></div>
Avec CSS en <head> et div en <body> : <head>
...
<style type="text/css">
#basdepage {
background-image:url(tst.JPG);
background-repeat:repeat-x;
width:100%;
height:128px; }
</style>
</head>
<body>
...
</form>
<div id="basdepage"></div>
</body>
</html>
Voilà, maintenant tu as plusieurs possibilités :
tu peux placer cette <div> dans un conteneur ou en bas de page ou dans un tableau, celà ne change rien au code sauf pour la largeur qui ne prendra pas toute la page mais celle du conteneur
Si tu veux décaler un peu ce bandeau du bas de ton formulaire (là il est juste en dessous), tu ajoute margin-top:100px; au code css. J'ai mis 100px mais tu détermine la valeur que tu veux.
C'est du CSS, si tu veux ajouter un texte par dessus ce bandeau d'image, tu peux écrire dans la balise <div>
Si besoin dis moi s'il y à un probleme ou si tu veux une modification du code (je ne sais pas ce que tu souhaite au final ...)
