Aller au contenu

Page d'accueil avec dreamweaver...


Sujets conseillés

Posté (modifié)

Bonjour,

j'ai un petit pb, je voudrais mettre un image dans un calque (car c'est très pratique et comme ça je peux la placer ou je veux) et que l'on puisse cliquer sur cette image pour etre redirigé, mais comment faire ? je n'arrive pas à associer un lien à un calque das lequel il y a une image...

Merci d'avance pour vos réponses........

Modifié par Magic63
Posté

Le CSS :

a.image {

display: block;

width: 300px; /* dimensions de ton image */

height: 300px;

background: url(image.gif) no-repeat;

}

Et dans ton HTML :

<a class="image" href="lien.htm title="cliquez !"></a>

Posté
Le CSS :

a.image {

  display: block;

  width: 300px;  /* dimensions de ton image */

  height: 300px;

  background: url(image.gif) no-repeat;

  }

Et dans ton HTML :

<a class="image" href="lien.htm title="cliquez !"></a>

Salut ! merci pour ta réponse, mais j'ai une petite question, que faut il que je fasse avec le code css ? je l'insère où? car moi j'ai fait une page html, donc je suppose que je ne l'insère pas au milieu des codes html...

Merci d'avance pour ta réponse....

Posté

Les CSS sont des feuilles de style qui permettent d'externaliser la mise en page de tes pages web.

L'avantage, c'est qu'en ayant une seule feuille de style pour un groupe de pages, tu peux modifier l'apparence compléte de ton site en ne modifiant que la feuille de style.

C'est un outil extrémement puissant.

Pour en savoir plus, je t'invite à consulter les publications du Hub, et en particulier :

http://www.webmaster-hub.com/publication/article62.html

Tizel

Posté (modifié)

Je voudrais également savoir comment faire pour mettre un image sans qu'il y ait de fond bac derriere, je m'explique: imaginez qu'on prenne un photo d'une personne sur un fond blanc, et bien moi je voudrais seulement une image qui soit le contour de la personne, sa silouhette et pouvoir enlever le fond blanc, qu'il n'y ait plus rien autour, donc que l'image ne soit plus rectangulaire par la même occasion...

Modifié par Magic63
Posté

Bonjour Magic63,

Pour pouvoir détourer une image, et en enlever le fond, il te faut un logiciel de traitement d'images, comme Photoshop ou Photoshop Elements.

Il y en a d'autres bien sûr (PaintShop Pro par exemple)

Une fois ton image nettoyée, il faudra la sauver dans un format lisible par les navigaturs et supportant la transparence.

Dans les formats qui supportent la transparence, tu as PNG et GIF... mais la transparence du format PNG n'est pas correctement rendue sous Internet Explorer.

Reste donc le GIF... mais qui lui ne supporte que 256 couleurs et est tres gourmand pour les photos. Il faudra faire des essais.

Ton image sera toujours rectangulaire parce qu'il n'y a pas moyen de la sauver autrement, mais le fond sera transparent donc le "rectangle" ne se verra pas.

Dan

Posté
Bonjour Magic63,

Pour pouvoir détourer une image, et en enlever le fond, il te faut un logiciel de traitement d'images, comme Photoshop ou Photoshop Elements.

Il y en a d'autres bien sûr (PaintShop Pro par exemple)

Une fois ton image nettoyée, il faudra la sauver dans un format lisible par les navigaturs et supportant la transparence.

Dans les formats qui supportent la transparence, tu as PNG et GIF... mais la transparence du format PNG n'est pas correctement rendue sous Internet Explorer.

Reste donc le GIF... mais qui lui ne supporte que 256 couleurs et est tres gourmand pour les photos. Il faudra faire des essais.

Ton image sera toujours rectangulaire parce qu'il n'y a pas moyen de la sauver autrement, mais le fond sera transparent donc le "rectangle" ne se verra pas.

Dan

Salut dan !

J'ai essayé de faire comme tu m'as dis, j'ai pris paint shop pro et j'ai enlevé tout le blanc autour, il ne me reste donc plus que la silouhette de la personne. Je l'ai ensuite enregistrée en format .gif, et losque je l'insère dans ma page web au format htlm, le rectangle blanc réapparait, pourtant l'image est bien en .gif

J'ai essayé en forma png c'est la même chose...

Je ne vois plus quoi faire... je désespère...

Posté

c'est simple : c'est parce que tu n'as pas "vidé" le fond dans le calque sous paint shop (qui n'est pas l'outil idéal au regard de photoshop mais qui peut suffire).

fait un calque vide (transparent, et non blanc) sur lequel tu poses ton élèment rond ou ovale ou détouré.

ensuite en enregistrant en gif ne te reste qu'à cocher l'option transparence et à gérer le nombre de couleur (descendre depuis 256 vers 128, 64, 32, 16, etc.) jusqu'à obtenir une image ressemblant à l'original et pas trop abimée ni trop pesante. le ratio qualité/poids doit être le meilleur possible.

tatonnes et tu y arriveras. la prochaine fois, fort de cette expérience, ça te semblera l'enfance de l'art.

Posté

Magic63,

Fais bien attention lorsque tu exportes l'image au format GIF, tu dois avoir une option permettant de selectionner "avec transparence". Sinon, sauves-la en prenant GIF-69 comme format. Je ne connais pas PaintShop Pro, donc je ne peux pas être très précis quant aux options a valider ;)

Dan

Posté

Bonjour Magic63,

En ce qui concerne PaintShopPro, le mieux est de passer par l'assistant de la fonction "exporter un gif", en demandant la transparence pour la couleur qui entoure la personne. Bien sur, cette couleur ne doit pas être sur la personne. Il faut choisir "meilleure couleur" et non "couleur pour le web".

Esperant t'avoir aidé,

Cyberlaura

Posté

Merci bien Dan et Cyberlaura.... vos 2 réponses m'ont bien aidé...tout à marché !

Je vais peu etre etre pénible, mais maintenant que j'ai réussi à mettre le gif avec fond transparent, pourriez vous me dire comment faire disparaitre le petit liseré blanc tout autour, sans ce liseré ce serait parfait.....

Merci bcp d'avance !

Posté

Magic63...

C'est le problème des images avec transparence, il faut choisir correctement la couleur de detourage (matte), par défaut le blanc.

Essaye de choisir une couleur intermédiaire entre celle de l'image et celle du fond.

Cela doit être dans les options d'exportation, en tout cas sous Photoshop.

Dan

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...