Pb insertion photos et mise en page

duc35 · 16 Octobre 2006

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

Chark · 16 Octobre 2006

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 ?

<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 )

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

le code css :
.monstyle img {
width:250px;
float:left;
}
.monstyle p {
float:left
}

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>

cela devrais fonctionner

duc35 · 17 Octobre 2006

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 :

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

duc35 · 17 Octobre 2006

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 :

.monstyle img {
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> :

<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>

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.

Chark · 17 Octobre 2006

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 :

entre les balises <head>et </head>
<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 ) :

<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

Connexion

Pb insertion photos et mise en page

Sujets conseillés

duc35

Chark

duc35

duc35

Chark

Veuillez vous connecter pour commenter

Parcourir

Activité