HTML DOM Estilo propriedades do fundo
estilo Objects Definição e Uso
fundo propriedade estenográfica para definir ou retornar até cinco propriedades do fundo separadas.
Com esta propriedade, você pode definir / retorno:
- background-color
- background-image
- background-repeat
- background-attachment
- background-position
As propriedades acima referidas podem ser proporcionados atributos de estilo separadas. recomenda o uso de um atributo separado a controlabilidade como melhor.
gramática
Defina as propriedades do fundo:
Object.style.background="color image
repeat attachment position"
Voltar propriedades do fundo:
Object.style.background
Dica: O valor padrão da propriedade é o fundo: transparente nenhuma repetição de rolagem 0% 0 %.
| 参数 | 描述 |
|---|---|
| color | 设置一个元素的背景颜色 |
| image | 设置一个元素的背景图像 |
| repeat | 设置如何重复背景图像 |
| attachment | 设置背景图像是否固定或者随着页面的其余部分滚动 |
| position | 设置背景图像的起始位置 |
Suporte a navegadores
Todos os principais navegadores suportam atributos de fundo.
Exemplos
Exemplos
Defina o estilo do fundo do documento:
<! DOCTYPE html>
<Html>
<Head>
<Charset Meta = "utf-8">
<Title> Este tutorial (w3big.com) </ title>
<Script>
displayResult function () {
document.body.style.background = "# f3f3f3 url ( 'img_tree.png') no-repeat superior direito";
}
</ Script>
</ Head>
<Body>
<H1> Olá mundo! </ H1>
<br>
<Button type = "button" onclick = "displayResult ()"> definir o fundo </ button>
</ Body>
</ Html>
<Html>
<Head>
<Charset Meta = "utf-8">
<Title> Este tutorial (w3big.com) </ title>
<Script>
displayResult function () {
document.body.style.background = "# f3f3f3 url ( 'img_tree.png') no-repeat superior direito";
}
</ Script>
</ Head>
<Body>
<H1> Olá mundo! </ H1>
<br>
<Button type = "button" onclick = "displayResult ()"> definir o fundo </ button>
</ Body>
</ Html>
tente »
estilo Objects