[CSS] Ombra sullo sfondo di una pagina Web

**-Admin-** · 21-01-2006, 20:05

Se ho ben capito per creare un "effetto ombra" sulla sfondo di una pagina web basta creare un'immagine ad hoc ed applicarla al sito.
Ora quello che mi domando è come faccio a giustificare i testi che andrò ad inserire nella pagina se non metto le tabelle?

Ho studiato alcuni siti che hanno adottato questa tecnica ma non ho capito come hanno fatto!

Grazie!

**alka** · 21-01-2006, 20:12

Questo forum non tratta l'argomento dei fogli di stile.

Ti sposto nel forum più adatto.

P.S.: ho rimosso il link in quanto potrebbe essere tacciato di "spam".

Ciao!

**-Admin-** · 21-01-2006, 20:16

Chiedo scusa per non aver postato nella board giusta....e pensare che sono utente di questo forum già da un bel pò!!!

Il link era da aiuto a spiegare cosa intendevo!

Grazie.

**fcaldera** · 21-01-2006, 20:19

supponiamo tu voglia creare uno spazio fisso in larghezza (es. 770px) e estensibile in altezza

ti crei l'immagine di sfondo (imgsfondo.jpg) larga 770px e alta 1px in cui ai bordi hai l'effetto ombra

crei un div con il seguente css

codice:

div {
  background: url(imgsfondo.jpg) repeat-y;
  padding: 20px;
}

a questo punto hai un area all'interno del div in cui scrivere ad una distanza interna da ciascun bordo di 20px

poi puoi allineare il testo come credi con la proprietà text-align: left | center | right | justify

p.s. la tabelle non andrebbero mai usate per creare il layout ma solo per organizzare dati

ciao

**-Admin-** · 21-01-2006, 20:24

Bhè che dire, GRAZIE mille!

Provo subito ed eventualmente posto i dubbi appena finito il tutto!

**fcaldera** · 21-01-2006, 20:27

ah un altra cosa. Nel css devi impostare anche la larghezza del div

quindi

codice:

div {
  width: 770px;
  background: url(imgsfondo.jpg) repeat-y;
  padding: 20px;
}

**-Admin-** · 21-01-2006, 20:34

Domanda idiota: come faccio ad applicare il div allo sfondo?

PS: utilizzando il tag <center> al background lo sfondo non si centra...!!!

**-Admin-** · 21-01-2006, 20:49

Oltre alle 2 domande che ho postato sopra vorrei sapere come si ripete verticalmente lo sfondo!

Grazie.

**pierofix** · 21-01-2006, 21:44

Facciamo finta di avere una struttura similare:

codice:

<body>
   <div id="contenitore">
      <h1>Io sono il titolo del documento</h1>
      

Io sono un interessantissimo paragrafo.</p>
   </div>
</body>

Proviamo ad attribuire al div #contenitore una larghezza di 500px e a centrarlo nella finestra. Inoltre, attribuiremo un'immagine di sfondo al body, facendola ripetere verticalmente:

codice:

body
{
   text-align:center;
   background:#fff url('sfondo.png') repeat-y 50% 50%;
}
#contenitore
{
   width:500px;
   margin:auto;
   text-align:left;
}

**-Admin-** · 22-01-2006, 00:42

Grazie...permettimi una precisazioni (così vedo anche se ho capito):
al div body manca il #, vero?

A cosa serve il text-align a questo div? Non è più utile per il contenitore

Come faccio Pierofix a creare un menù a lato dei contenuti centrali del portale come quello che hai inserito nel sito itgmarinoni?

Grazie.

Discussione: [CSS] Ombra sullo sfondo di una pagina Web

Strumenti discussione

Ricerca discussione

Visualizza

[CSS] Ombra

Moderazione

Permessi di invio