A funçãoCSSelement() define uma<image> gerada de um elemento HTML qualquer. Essa imagem édinamica, significando que se o elemento HTML for mudado, a propriedade CSS usando este valor será atualizada automaticamente.

Um cenario particularmente util para usar esta função seria colocar uma imagem em um elemento<canvas>, e então usar-lo como umbackground.

Em navegadores Gecko, você pode usar o metodo não padronizadodocument.mozSetImageElement() para mudar o elemento sendo usado comobackground por um elemento debackground selecionado por CSS.

Sintaxe

element( id )

Onde:

id

É o ID de um elemento para usar como background, especificado usando o atributo HTML #id no elemento.

Exemplos

Esses exemplos podem servistos em tempo real em versões do Firefox que suportam-moz-element().

Um exemplo de alguma maneira real

Esse exemplo usa uma<div> escondida comobackground. O elemento debackground tem um gradiente, mas tambem um texto que é usado como parte dobackground.

<div >  <p>This box uses the element with the #myBackground1 ID as its background!</p></div><div>  <div      >    <p>      This text is part of the background. Cool, huh?    </p>  </div></div>

A<div> com ID "myBackground1" é usada comobackground, mantendo o paragrafo "This box uses the element with the #myBackground1 ID as its background!".

Um exemplo ainda mais bizarro

Esse exemplo usa um elemento<button> se repetindo comobackground. Isso mostra que você pode usar qualquer elemento como background, mas não mostra necessariamente boas praticas de design.

<div ></div><div>  <button type="button">Evil button!</button></div>

Especificações

Compatibilidade dos navegadores

Veja tambem

• document.mozSetImageElement()