Immagini: come inserirle dietro al testo!

**Jack96** · 16-10-2006, 20:55

Sono in XHTML 1.0 Sctrict e volevo inserire immagini dietro al testo scritto!
Ho usato il CSS per testo e tutto: mi manca solo tale codice per collocare
tale immagine dietro al testo! Chi mi può aiutare?

Spero che non sia da fare in XHMTL perché altrimenti mi scuso per aver sbagliato sezione!

Grazie infinite!

**Alberto** · 17-10-2006, 09:20

Devi usare un immagine di sfondo, ti linko la guida qui

**Mich_** · 17-10-2006, 09:22

L'immagine deve essere lo sfondo (background-image) del blocco in cui devi scrivere (probabilmente <div> o

, a seconda di come e` realizzato il codice (X)HTML).

Poi se hai bisogno di info piu` dettagliate, devi essre piu` dettagliato tu stesso (ad es. postando coidce HTML+CSS del pezzo in questione)

**Jack96** · 17-10-2006, 17:47

Ok per l'immagine (grazie di cuore)

Però il testo rimane sempre in alto... sulla guida mica lo trovo il modo per posizionarlo perfettamente al centro come l'immagine...

Questa è la parte della pagina XHTML

<body>
<div id="div1">TITOLO</div>
<div id="div2">IL TESTO</div>
</body>
</html>

E questo è il CSS

body {background: white; font-family: Verdana, sans-serif;
background-image: url(box_notifica.png);
background-repeat: no-repeat;
background-position: center center;}
#div1 {font: 31px; color=#738AA2; font-weight: bold; text-align: center;}
#div2 {font: 11pt; color=#738AA2; font-weight: bold; text-align: center;}

**Mich_** · 17-10-2006, 17:59

Intanto stai usando tag sbagliati: i titoli vanno inseriti con i tag <h1>, h2, ...

Il tasto va inserito dentro un

In XHTML Strict e` un errore non usarlo.

Poi per centrare occorre che nel blocco esterno ci siano delle dimensioni.

Per centrare un testo di una sola linea, conviene usare il line-height assieme al text-align (da inserire nel CSS del

).
Per centrare un testo su piiu` righe si puo` "giocare" con i margini (nei browser standard).

**Jack96** · 18-10-2006, 15:47

Non mi riesce

volevo ottenere quello come la foto!
Se uno mi potesse aiutare solo per questa volta (almeno capisco il tutto) ne sarei tremendamente grato!

P.S Come mai il convalidatore W3C in XHTML 1.0 Strict dice che è in regola invece?

**Mich_** · 18-10-2006, 16:17

Quindi c'e` un blocco, che a sua volta contiene un titolo e del testo.

codice:

<div id="blocco">
  <h1>titolo</h1>
  

testo testo testo</p>
</div>

Questo blocco va centrato e fornito di sfondo:

codice:

html, body {
  width: 100%; height: 100%;
  text-align: center;           /* servono per IE */
  vertical align: middle;
  font-size: 150%;           /* o la misura che vuoi */
}
#blocco {
  margin: auto;
  backgrond-iamge: url(path/nomefile);
}
#blocco h1 {
  font-size: 200%;
  margin 0 auto;         /* centratura orizzontale all'nterno del blocco */
}
#blocco p {
  margin: 0 auto;
}

PS: il validatore non e` in grado di riconosere errori di semantica.

Discussione: Immagini: come inserirle dietro al testo!

Strumenti discussione

Ricerca discussione

Visualizza

Immagini: come inserirle dietro al testo!

Permessi di invio