propriedade HTML DOM Estilo borderColor
estilo Objects Definição e Uso
BORDERCOLOR conjuntos de propriedades ou retorna a cor da borda de um elemento.
Esta propriedade pode ser usado 1-4 tipos de cores:
- Se você especificar uma cor, por exemplo: p {border-color: red} - todas as quatro bordas são vermelhas.
- Se você especificar duas cores, por exemplo: p {border-color: transparent red} - bordas superior e inferior são vermelhas, e da fronteira esquerda e à direita da caixa é transparente.
- Se as disposições das três cores, por exemplo: P {border-color: blue red green} - beira vermelha, beira esquerda e margem direita é verde, o limite inferior é azul.
- Se as disposições de quatro cores, por exemplo: p {border-color: vermelho verde amarelo azul} - na fronteira são caixa vermelha, verde, à direita, sob a fronteira azul, fronteira esquerda é amarelo.
gramática
Definindo as propriedades BORDERCOLOR:
Object.style.borderColor="color|transparent|inherit"
Voltar propriedades BORDERCOLOR:
Object.style.borderColor
| 值 | 描述 |
|---|---|
| color | 规定边框的颜色。在 CSS 颜色值 中寻找可能的颜色值的完整列表。 |
| transparent | 默认。边框的颜色是透明的（基本内容将会穿透）。 |
| inherit | 边框的颜色从父元素继承。 |
Suporte a navegadores
Todos os principais navegadores suportam borderColor propriedade.
Nota: IE7 e versões anteriores não suportam o valor "herdar".IE8 só fornece! DOCTYPE suportado "herdar". suporte IE9 "herdar".
Exemplos
Exemplos
Mudar a cor das quatro bordas:
<! DOCTYPE html>
<Html>
<Head>
<Charset Meta = "utf-8">
<Title> Este tutorial (w3big.com) </ title>
<Style type = "text / css">
# Ex1 {
border: grossa # FF0000 sólida;
}
</ Style>
<Script>
displayResult function () {
document.getElementById ( "EX1") style.borderColor = "# 00FF00 # 0000FF" .;
}
</ Script>
</ Head>
<Body>
<Div id = "EX1"> Este é um texto. </ Div>
<br>
<Button type = "button" onclick = "displayResult ()"> alterar a cor das quatro bordas </ button>
</ Body>
</ Html>
<Html>
<Head>
<Charset Meta = "utf-8">
<Title> Este tutorial (w3big.com) </ title>
<Style type = "text / css">
# Ex1 {
border: grossa # FF0000 sólida;
}
</ Style>
<Script>
displayResult function () {
document.getElementById ( "EX1") style.borderColor = "# 00FF00 # 0000FF" .;
}
</ Script>
</ Head>
<Body>
<Div id = "EX1"> Este é um texto. </ Div>
<br>
<Button type = "button" onclick = "displayResult ()"> alterar a cor das quatro bordas </ button>
</ Body>
</ Html>
tente »
estilo Objects