Propriedade de estilo borderWidth
Exemplo
Altere a largura das quatro bordas de um elemento <div>:
document.getElementById("myDiv").style.borderWidth = "thick";
Definição e uso
A propriedade borderWidth define ou retorna a largura da borda de um elemento.
Esta propriedade pode assumir de um a quatro valores:
- Um valor, como: p {border-width: thick} - todas as quatro bordas serão grossas
- Dois valores, como: p {border-width: thick thin} - as bordas superior e inferior serão grossas, as bordas esquerda e direita serão finas
- Três valores, como: p {border-width: espessura fina média} - a borda superior será grossa, a borda esquerda e a direita serão finas, a borda inferior será média
- Quatro valores, como: p {border-width: thick thin medium 10px} - a borda superior será grossa, a borda direita será fina, a borda inferior será média, a borda esquerda será 10px
Suporte ao navegador
Property | |||||
---|---|---|---|---|---|
borderWidth | Yes | Yes | Yes | Yes | Yes |
Sintaxe
Retorne a propriedade borderWidth:
object.style.borderWidth
Defina a propriedade borderWidth:
object.style.borderWidth = "thin|medium|thick|length|initial|inherit"
Valores de propriedade
Value | Description |
---|---|
thin | Defines a thin border |
medium | Defines a medium border. This is default |
thick | Defines a thick border |
length | The width of the border in length units |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Detalhes técnicos
Valor padrão: | médio |
---|---|
Valor de retorno: | Uma String, representando a largura da borda de um elemento |
Versão CSS | CSS1 |
Mais exemplos
Exemplo
Altere a largura da borda superior e inferior para grossa e a borda esquerda e direita para fina de um elemento <div>:
document.getElementById("myDiv").style.borderWidth = "thick thin";
Exemplo
Altere a largura das quatro bordas de um elemento <div>, usando o valor de comprimento :
document.getElementById("myDiv").style.borderWidth = "1px 5px 10px 20px";
Exemplo
Retorna a largura da borda de um elemento <div>:
alert(document.getElementById("myDiv").style.borderWidth);
Páginas relacionadas
Tutorial CSS: borda CSS
Referência CSS: propriedade de largura de borda
Referência HTML DOM: propriedade border
❮ Objeto de estilo