CSS3 clip de fondo

Question

Estoy usando -webkit-background-clip para restringir una imagen de fondo al texto en un elemento h2.

Mi pregunta es, ¿la función -moz-background-clip funciona de la misma manera? Esto sólo parece funcionar en los navegadores WebKit, lo que sugiere que aún no funciona en Firefox:

#header h1 a{ 
    background: url(img/logo-overlay.png) no-repeat #000; 
    -moz-background-clip: text; -webkit-background-clip: text; 
    color: transparent; -moz-text-fill-color: transparent; -webkit-text-fill-color: transparent; 
    text-decoration: none; 
} 

Actualmente, en Firefox, el texto está oculto (debido al color: transparente y el texto de relleno de color: propiedades transparentes) y solo la imagen de fondo y el color son visibles en la forma rectangular del elemento.

¿Alguna idea?

Answer 1

No creo que text sea un valor válido para la propiedad background-clip.

MDC establece dos declaraciones diferentes, una para Firefox 3.6 y una versión posterior, y la otra para el próximo Firefox 4. También establece el equivalente de webkit.

Firefox (Gecko)  
1.0-3.6 (1.2-1.9.2) -moz-background-clip: padding | border 
4.0 (2.0)    background-clip:  padding-box | border-box | content-box 

Safari (WebKit) 
3.0 (522)    -webkit-background-clip: padding | border | content 

ver el documento MDC aquí: https://developer.mozilla.org/en/CSS/background-clip

En cuanto a lo que estamos tratando de lograr, creo que el valor content-box es lo que estás buscando. Tenga en cuenta que Firefox 3.6 y versiones posteriores no parecen admitir este valor.

Ver: http://www.css3.info/preview/background-origin-and-background-clip/