Texto degradado con CSS

cslbcn · #1 (**permalink**) 06/10/2011, 03:19

Hola. Estoy usando un truco de CSS para tener texto degradado. Es el siguiente:

Código HTML:

Ver original<html>
<style>
    body{
        background-color:#000;
    }
    
    .Degradado h1 span{
        background-image:url(D.png);
        height:50px;
        width:500px;
        position: absolute; 
        
    }
    .Degradado h1{
        color:#FFF;
        font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
        font-size:40px;
    }
    
</style>
    <div style="height:50px;" class="Degradado">
        <h1><span></span>Web</h1>
    </div>
 
</html>

El problema que tengo es que si el fondo de pantalla es una imagen, se ve el corte de la imagen degradada, el .PNG.

Alguien conoce alguna manera de evitar esa superposición o que al menos lo suavice un poco? Es imposible?

Gracias