Bonjour a tous et à toutes,
Sur mon site, j'ai inséré une image.jpg 300 * 250 qui en réalité est une image plus grande.
1) Je ne sais quelles commandes utiliser pour qu'en double-cliquant dessus, elle apparaisse en taille réelle ?
2) Comment écrire du texte sur le côté droit d'une photo? J'ai essayer de prolonger mon texte a cette ligne de commande :" <img src="mes images/image/image.jpg" height="300" width="250"/>. Puis blalalalalala ". Mais mon texte apparait en dessous de la photo...
Merci par avance de votre aide
Version complète: sur le forum Webmaster Hub : Pb insertion photos et mise en page
CITATION(duc35 @ lundi 16 octobre 2006, 15h53) 
Sur mon site, j'ai inséré une image.jpg 300 * 250 qui en réalité est une image plus grande.
1) Je ne sais quelles commandes utiliser pour qu'en double-cliquant dessus, elle apparaisse en taille réelle ?
1) Je ne sais quelles commandes utiliser pour qu'en double-cliquant dessus, elle apparaisse en taille réelle ?
CODE
<a href="mes images/image/image.jpg" target="_blank" onclick="window.open(this.href, 'photo', 'height=800, width=600, top=10, left=10, toolbar=no, menubar=no, location=no, resizable=yes, scrollbars=no, status=no'); return false;"><img src="mes images/image/image.jpg" height="300" width="250"/></a>
Cela te permet d'ouvrir ta photo en febetre popup en cliquant dessus, et si le javacript est désactivé, cela ouvre la photo dans une nouvelle fenetre. ( replacer le height=800 width=600 par les valeurs de la taille de la photo taille réelle )
CITATION
2) Comment écrire du texte sur le côté droit d'une photo? J'ai essayer de prolonger mon texte a cette ligne de commande :" <img src="mes images/image/image.jpg" height="300" width="250"/>. Puis blalalalalala ". Mais mon texte apparait en dessous de la photo...
Il faut utiliser des styles css en float
CODE
le code css :
.monstyle img {
width:250px;
float:left;
}
.monstyle p {
float:left
}
.monstyle img {
width:250px;
float:left;
}
.monstyle p {
float:left
}
CODE
et pour le code dans ta page html :
<div class="monstyle">
<img src="mes images/image/image.jpg" height="300" width="250"/>
<p>
blabla
</p>
<div style="clear:both;"></div>
</div>
<div class="monstyle">
<img src="mes images/image/image.jpg" height="300" width="250"/>
<p>
blabla
</p>
<div style="clear:both;"></div>
</div>
cela devrais fonctionner
Merci ca marche impécable pour la fenêtre pop up . sauf que faut rajouter la taille de la photo que l'on souhaite laisser sur la page principale :
<img src="C:\Mesimages\images.image.jpg height="200" width="510" target="_blank" onclick="window.open(this.href, 'photo', 'height=391, width=1000, top=10, left=10, toolbar=no, menubar=no, location=no, resizable=yes, scrollbars=no, status=no')"/>
Pour le css
. j'en suis pas encore là ... Faut que j'étudie encore la chose. Et je crois qu'il faut le faire sur une autre page.
Salutations
<img src="C:\Mesimages\images.image.jpg height="200" width="510" target="_blank" onclick="window.open(this.href, 'photo', 'height=391, width=1000, top=10, left=10, toolbar=no, menubar=no, location=no, resizable=yes, scrollbars=no, status=no')"/>
Pour le css
. j'en suis pas encore là ... Faut que j'étudie encore la chose. Et je crois qu'il faut le faire sur une autre page.Salutations
Là je BLOQUE grave pour le css, je vais essayer d'être clair.
Pour écrire à côté de la photo j'ai donc écrit tel quel, dans un dossier monstyle.css, le code suivant :
Puis, j'ai insérer le code suivant dans la page html entre les balises <head> </head> :
Mais ça ne fonctionne pas; j'ai la photo qui apparait au niveau de l'entête du document . Et mon texte n'apparait pas à côté de la photo.
J'espère que j'ai été clair.
Merci pour vos lumières.
Pour écrire à côté de la photo j'ai donc écrit tel quel, dans un dossier monstyle.css, le code suivant :
CODE
.monstyle img {
width:250px;
float:left;
}
.monstyle p {
float:left
}
width:250px;
float:left;
}
.monstyle p {
float:left
}
Puis, j'ai insérer le code suivant dans la page html entre les balises <head> </head> :
CODE
<div class="monstyle">
<img src="mes images/image/image.jpg" height="300" width="250"/>
<p>
mon texte ici
</p>
<div style="clear:both;"></div>
</div>
<img src="mes images/image/image.jpg" height="300" width="250"/>
<p>
mon texte ici
</p>
<div style="clear:both;"></div>
</div>
Mais ça ne fonctionne pas; j'ai la photo qui apparait au niveau de l'entête du document . Et mon texte n'apparait pas à côté de la photo.
J'espère que j'ai été clair.
Merci pour vos lumières.
CITATION
Puis, j'ai insérer le code suivant dans la page html entre les balises <head> </head> :
Il faut plutot mettre ce code entre les balise <body> et </body>
et n'as tu pas oublié de mettre un lien vers ta feuille de style css ?
du genre :
CODE
entre les balises <head>et </head>
<link href="styles/style.css" rel="stylesheet" type="text/css">
<link href="styles/style.css" rel="stylesheet" type="text/css">
sinon, si tu ne sais pas vraiment comment faire, tu le met directement dans ta page.
Le code de la page complete ( avec les styles directement dans la page ) :
CODE
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.monstyle img {
width:250px;
float:left;
}
.monstyle p {
float:left
}
-->
</style>
</head>
<body>
<div class="monstyle">
<img src="mes images/image/image.jpg" height="300" width="250"/>
<p>
mon texte ici
</p>
<div style="clear:both;"></div>
</div>
</div>
</body>
</html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.monstyle img {
width:250px;
float:left;
}
.monstyle p {
float:left
}
-->
</style>
</head>
<body>
<div class="monstyle">
<img src="mes images/image/image.jpg" height="300" width="250"/>
<p>
mon texte ici
</p>
<div style="clear:both;"></div>
</div>
</div>
</body>
</html>
essaye, ca marche parfaitement
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.