Immagine dentro Immagine

[boes]

Immagine dentro Immagine

Ciao amici,

mi servirebbe inserire un immagine dentro un altra immagine che le fa da contorno,
vi posto un esempio fatto con PS dove il cerchio rosso e l immagine di bordo e il quadrato nero l immagine principale, spero possiate aiutarmi..

immagine: http img530.imageshack.us/img530/488/immm.jpg

Francesco

[codencode]

Si può fare in tanti modi.
Uno è questo:

• crea un div con le dimensioni pari a quelle dell'immagine esterna;
• assegna a questo div un background con l'immagine esterna;
• posiziona nel div l'immagine interna.
  Nell'HTML avrai:
  [HTML]
  <div id="immagini">
  <img src="imgInterna.jpg" alt="" />
  </div>
  [/HTML]
  Nel CSS avrai:
  [HTML]
  div#immagini {
  width: *** larghezza immagine esterna ***;
  height: *** altezza immagine esterna ***;
  background: url('imgEsterna.jpg');
  }
  div#immagini img {
  *** inserisci le istruzioni per posizionarla dove vuoi ***
  }
  [/HTML]

In alternativa, se hai bisogno di entrambe le immagini nell'HTML:

• crea un div con le dimensioni pari a quelle dell'immagine esterna;
• posiziona nel div l'immagine esterna con uno z-index minore;
• posiziona nel div l'immagine interna con uno z-index maggiore.
  Nell'HTML avrai:
  [HTML]
  <div id="immagini">
  <img id="imgEs" src="imgEsterna.jpg" alt="" />
  <img id="imgIn" src="imgInterna.jpg" alt="" />
  </div>
  [/HTML]
  Nel CSS avrai:
  [HTML]
  div#immagini {
  position: relative;
  width: *** larghezza immagine esterna ***;
  height: *** altezza immagine esterna ***;
  }
  img#imgEs {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  }
  img#imgIn {
  position: absolute;
  *** inserisci le istruzioni per posizionarla dove vuoi ***
  z-index: 20;
  }
  [/HTML]

[html5today]

... oppure, se vuoi avventurarti in HTML5, puoi provare con background multipli.

[boes]

grz molte, avevo gia provveduto inserendo un div con i dati css dentro il foglio html,, grazie milla