High-Tech Santé Médecine Droit-Finances

Réalisation

vidéo numérique

Rechercher : dans
Par :

Création site html "image qui se balade"

Dernière réponse le 13 jun 2009 à 12:08:45 toros62, le 12 jun 2009 à 18:29:10 
 Signaler ce message aux modérateurs

Bonjour, je débute en création de site web de type html.

Mon problème étant que quand je regard ma page final du site je vois mon image qui bouge en fonction du rétrécissement ou l'agrandissement de ma page.

j'ai utilisé la position: absolute; pour mettre mon image a un endroit précis particulièrement en haut a droite en dessous de la bannière.
( mon image et mise directement dans le css

aider moi svp merci d'avance de votre aide.
j ai procéder comme ce-ci: (fichier) css

#icone
{
float: right;
width: 260px;
height: 177px;
background-image: url("electricite.png");
position: absolute;
top: 20%;
right: 10%;
}


toros62

Configuration: Windows XP
Firefox 3.0.10

Meilleures réponses pour « création site html "image qui se balade" » dans :
Comment creer un site HTML (Résolu) Voir
[site d'image ou de photo] (Résolu) Voir
Créer une image animée avec REFLET Voir Reflet pour créer vos images animées Pourquoi toujours télécharger des images gif sur des sites ? Alors qu'il est plus simple et créatif de créer sa propre image animée ? Le logiciel Reflet vous permet de mettre votre talent de créateur au grand...
Créer un site beau, dynamique et respectueux des standards VoirVoici une liste de liens qui vous aideront à mieux exploiter les standards (HTML, CSS, DOM...) pour créer des sites plus beau, plus dynamiques et plus respectueux des standards. A la fin de cette page, il y a également une liste de...
Créer un site internet Voir
Favicon - L'icône de votre site dans la barre d'adresse VoirVous avez sûrement remarqué la présence d'une icône à gauche de l'URL dans la barre d'adresse de votre navigateur sur certains sites web ? Pour mettre en place ce type d'icône sur votre propre site web il n'y a rien de plus simple. Créer la...
Posez votre question Répondre

1

ApprendreInformatique, le 12 jun 2009 à 18:33:23

Salut,

Si tu enlève : 

top: 20%;
right: 10%;


ça donne quoi ? Apprendre Informatique - Communauté francophone des informat­iciens en herbe

   
Répondre à ApprendreInformatique

2

toros62, le 12 jun 2009 à 18:37:30

Salut,

alors si j'enlève top et right l'image ce met au point de départ en haut a gauche et la elle ne bouge plus ds la page mais le pb c que j aimerai la mettre ou je veut.

   
Répondre à toros62

3

ApprendreInformatique, le 12 jun 2009 à 18:40:09

Je te conseil de faire comme ça :

Tu créer un div a l'endroit de ta page ou tu veux que ton image apparaissent et tu lui ajoute la class .icone
Pour le CSS tu enlève bien : 

top: 20%;
right: 10%;


Ton site est en design fixe ou extensible ?

Apprendre Informatique - Communauté francophone des informat­iciens en herbe

   
Répondre à ApprendreInformatique

4

toros62, le 12 jun 2009 à 18:44:53

Design fixe j ai pas encore appris l'extensible, mais le problème c que si je fais comme tu dit je ne pourrais plus bougé l'image a moin qui y a une astuce pour le mettre ou on veut dans le html ? "je début"c pas évident a ts retenir^^

   
Répondre à toros62

5

ApprendreInformatique, le 12 jun 2009 à 18:56:29

Si tu pourra la bouger en CSS, tu fera un padding-left:80% par exemple Apprendre Informatique - Communauté francophone des informat­iciens en herbe

   
Répondre à ApprendreInformatique

6

toros62, le 12 jun 2009 à 19:08:13

Tu peut m'expliquer en détaille comment tu ferais ca serai sympa a moin que ta un genre tuto a me conseillé a part le site du zero ( je l ai déja vu) merci pr ton aide

   
Répondre à toros62

7

ApprendreInformatique, le 12 jun 2009 à 19:12:45

Si j'ai bien compris tu veux positionner ton image juste en dessous de ton header ?

peux tu m'envoyer un petit bout de code ?

Apprendre Informatique - Communauté francophone des informat­iciens en herbe

   
Répondre à ApprendreInformatique

8

toros62, le 12 jun 2009 à 19:37:09

Oui
ca te va si je te passe le lien de ma page internet :http://andrieux-electricite.1s.fr/

   
Répondre à toros62

9

ApprendreInformatique, le 12 jun 2009 à 19:40:59

Je regarde ça vers 21H30 ;) Apprendre Informatique - Communauté francophone des informat­iciens en herbe

   
Répondre à ApprendreInformatique

10

toros62, le 12 jun 2009 à 19:48:45

Ok merci on ma deja dit aussi que ma frame était mal foutue mais c koi exactement la frame c est les symbole

encore merci pr ton aide

   
Répondre à toros62

11

ApprendreInformatique, le 12 jun 2009 à 21:17:38

Euh je ne comprend pas trop la ton site, il n'y a rien ? je vois que lycos ... Apprendre Informatique - Communauté francophone des informat­iciens en herbe

   
Répondre à ApprendreInformatique

12

toros62, le 13 jun 2009 à 00:37:13

Ba si en faite mon hébergeur c'est lycos et j' ai changer mon nom de domaine en cliquant sur le lien tu arrive sur la page normalement moi ça marche j ai déjà testé sur plusieurs pc je te passe mon code html.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>ANDRIEUX ELECTRICITE !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Designe" href="designe.css" />
</head>

<body>
<div id="en_tete">

<p><strong>EN CONSTRUCTION</strong></p>

</div>
<div id="topad">
<div id="icone"> </div>
</div>

<div id="menu">
<div class="element_menu">
<h3>Les services proposées</h3>
<ul> <li><a href="alarme.html">Alarme</a></li>
<li><a href="dépannage.html">Dépannage</a></li>
<li><a href="video.html">Vidéo</a></li>
<li><a href="automatisme">Automatisme</a></li>
<li><a href="électricité_générale">Electricite générale</a></li>
</ul>
</div>
</div>

<div id="corps">
<h2 class="titre1">Coordonnée de l'entreprise</h2>
<p class="textprinc">
<strong>Adresse:</strong>
<br />214 rue de Calais
<br />62370 Saint-Folquin
<br />
<br /><strong>N°Tél:</strong> 06-32-99-13-04</span>
<br />
<br /><strong>Adresse email:</strong>
<a href="mailto:Andrieux-jerome@orange.fr">Andrieux-jerome@orange.fr</a>
</p>
</div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />

<div id="pied_de_page">
<p>Copyright ToRos 2009, tous droits réservés</p>
</div>

</body>

</html> <textarea style="display :none">

   
Répondre à toros62

13

ApprendreInformatique, le 13 jun 2009 à 09:58:55

Ok je vois, pour le moment la petite maison est en haut a droite juste en dessous du header, c'est pas e que tu voulais faire ? Apprendre Informatique - Communauté francophone des informat­iciens en herbe

   
Répondre à ApprendreInformatique

14

 toros62, le 13 jun 2009 à 12:08:45

Oui j ai réussi a régler le pb on m a dit de mettre un parent (topad) au conteneur d'icone et de modifié mon fichier css comme ce ci par contre je pe pas le descendre ou monté mon image avec cette méthode tu serai toi ?

#topad
{
position: relative;

}

#icone
{
width: 260px;
height: 177px;
background-image: url("electricite.png");
position: absolute;
right: -3%;
}

   
Répondre à toros62
Posez votre question Répondre
Ils ont besoin de votre aide