Div opaco ma testo nitido.

**joint77** · 24-11-2009, 16:56

Ho letto un paio di altre discussioni a rigauardo, io ho risolto utilizzando gli z-index (basso per il div opaco e alto per quello con il testo nitido) sono poi entrambi all'interno di un div relativo e il div con il testo è un div relativo.

codice:

CSS:
.div_1 {
position:relative;
background-image:url(../img/occhi_di_gatto.jpg);
//un' immagine qualsiasi per vedere la trasparenza
width:800px;
height:600px;
margin:auto;
}

.div_2 {
background-color:#FF0000;
width:500px;
height:500px;
margin-left:auto;
margin-right:auto;
-moz-opacity: .50;
opacity: .50;
filter: alpha(opacity=50);
z-index:-5000;
}

.div_3 {
    font-family:Arial, Helvetica, sans-serif;
    font-weight:bold;
	position:absolute;
	width:500px;
	height:500px;
	margin-left:auto;
	margin-right:auto;
	z-index:5000;
	left: 149px;
	top: 0px;
}

HTML:

<body>
<div class="div_1"><div class="div_2">
</div>
<div class="div_3">

  


  PROVAPROVAPROVAPROVAPROVAPROVA

  PROVAPROVAPROVAPROVAPROVAPROVA

  PROVAPROVAPROVAPROVAPROVAPROVA

  PROVAPROVAPROVAPROVAPROVAPROVA

  PROVAPROVAPROVAPROVAPROVAPROVA

  PROVAPROVAPROVAPROVAPROVAPROVA

  </span></div>
</div>
</div>
</body>

Vorrei sapere se c'è qualche altro modo per avere lo stesso risultato, magari più semplice, ho messo la prova QUI

N.B. Mi sono accorto che su Safari questo metodo non funziona, magari qualcuno conosce un Hack?

Grazie, Ale.

**fcaldera** · 24-11-2009, 18:42

di norma si usano le png semitrasparenti come sfondo.

**joint77** · 24-11-2009, 20:15

Volevo solo vedere questa cosa dei div opachi, cmq per il lavoro che dovrò fare mi sa che userò png trasparenti ripetute sugli assi, dovrebbe dare lo stesso effetto, grazie.

Discussione: Div opaco ma testo nitido.

Strumenti discussione

Ricerca discussione

Visualizza

Div opaco ma testo nitido.

Si lo so

Permessi di invio