Nesta dica mostrarei como podemos usar a propriedade border-color do CSS para definir a cor da borda de um elemento HTML. Note que, para alterar a cor da borda do elemento HTML, é preciso antes verificar se ele possui borda. Caso contrário teremos que manipular também as propriedades border-style e border-width.
Veja uma página HTML completa na qual usamos CSS para manipular a largura (width), o espaçamento interno (padding), as margens (margin), o estilo da borda (border-style), a largura da borda (border-width) e a cor da borda (border-color) de um elemento DIV:
 |
Este código completo faz parte do nosso Super Pack Aprenda a Programar - 12.000 Dicas e Truques de Programação e 1.500 Exercícios Resolvidos. |
Domine lógica de programação e várias linguagens de programação com o nosso Super Pack Aprenda a Programar - 12.000 Dicas e Truques de Programação e 1.500 Exercícios Resolvidos.
Torne-se um(a) expert em Java, Portugol, VisuAlg, Python, PHP, JavaScript, Delphi, C, C++, C#, VB.NET, LISP, Ruby, e muito mais. São mais de 15.000 páginas com conteúdo exclusivo para você estudar onde e quando quiser. |
Me Fala Mais |
A propriedade border-color aceita de um até quatro valores na seguinte ordem: borda superior, borda direita, borda inferior e borda esquerda. Assim, o código abaixo:
 |
Este código completo faz parte do nosso Super Pack Aprenda a Programar - 12.000 Dicas e Truques de Programação e 1.500 Exercícios Resolvidos. |
Domine lógica de programação e várias linguagens de programação com o nosso Super Pack Aprenda a Programar - 12.000 Dicas e Truques de Programação e 1.500 Exercícios Resolvidos.
Torne-se um(a) expert em Java, Portugol, VisuAlg, Python, PHP, JavaScript, Delphi, C, C++, C#, VB.NET, LISP, Ruby, e muito mais. São mais de 15.000 páginas com conteúdo exclusivo para você estudar onde e quando quiser. |
Me Fala Mais |
aplica um cor diferente para cada uma das bordas do elemento.
O valor da cor para a propriedade border-color do CSS pode ser definido como o nome de um cor em inglês (por exemplo, "blue"), por um código hexadecimal (por exemplo, "#0288d1"), um código RGB (por exemplo, "rgb(255,30,90)"), um código HSL (por exemplo, "hsl(40%, 100%, 30%)") ou o valor "transparent".
|