Effetto ombra con css?

**O'NEIL** · 19-03-2006, 15:58

Buon pomeriggio!
Ho creato questa tabella (codice sotto) e vorrei (se si può)di dare un effetto ombra tramite il codice css usato per creare il tutto.
Qualche suggerimento?

codice:

<head>
<style>

/* STILE BASE PAGINA */

body
{
    background-color: #FFFFFF;
}
div
{
    font: Normal 10px Verdana;
}
a
{
    color: #FFFFFF;
}

/* BORDI E CONTENUTO BOX */

div.BORDI
{
    width: 520px;
}
div.CONTENUTO
{
    background-color:brown;
    color: #FFFFFF;
    width: 520px;
    padding: 5px;
}

/* CREAZIONE ANGOLI  */

span.TOP, span.BOTTOM
{
    display: Block;
    background-color: #FFFFFF;
}
span.TOP span, span.BOTTOM span
{
    display: Block;
    overflow: Hidden;
    background-color: brown;
    height: 1px;
}
span.RIGA1
{
    margin: 0 5px;
}
span.RIGA2
{
    margin: 0 3px;
}
span.RIGA3
{
    margin: 0 2px;
}
span.TOP span.RIGA4, span.BOTTOM span.RIGA4
{
    margin: 0 1px;
    height: 2px;
}

</style>


</head>

<body>

<div class="BORDI">
    <span class="TOP">
        <span class="RIGA1"></span>
        <span class="RIGA2"></span>
        <span class="RIGA3"></span>
        <span class="RIGA4"></span>
    </span>
</div>
<div class="CONTENUTO">
    TESTO


    
testo testo testo
testo testo
   
</div>
<div class="BORDI">
    <span class="BOTTOM">
        <span class="RIGA4"></span>
        <span class="RIGA3"></span>
        <span class="RIGA2"></span>
        <span class="RIGA1"></span>
    </span>
</div>

</body>

**andrea.paiola** · 19-03-2006, 16:17

se i dati son tabellari perchè non hai usato una tabella?
comunque puoi mettere degli sfondi (o immagini di sfondo)

**O'NEIL** · 20-03-2006, 11:37

Originariamente inviato da andrea.paiola

se i dati son tabellari perchè non hai usato una tabella?
comunque puoi mettere degli sfondi (o immagini di sfondo)

grazie!

*pragma · 20-03-2006, 20:11

devi lottare con i browser.
ho messo un bordo al div solo per riferimento.
Ha ragione paiola .. meglio un'immagine.
<html>
<head>

<style>
.title1
{
position:relative;top:0;font-wight: 700; font-size: 44px;

color: #663333; font-family: arial;z-index: 0;border:1px red solid;
}

.title2
{
position:relative;top:-83px;left:-2px;font-wight: 700;

font-size: 44px; color: #996633; font-family: arial;z-index:+1;
}
</style>

</head>

<body >
<div>
<h1 class="title1">EFFETTO OMBRA</h1>

<h1 class="title2">EFFETTO OMBRA</h1>
</div>
</body>
</html>
ciao

Discussione: Effetto ombra con css?

Strumenti discussione

Ricerca discussione

Visualizza

Effetto ombra con css?

Permessi di invio