Propriedades das bordas no html

Nesse artigo irei falar sobre a propriedade border do HTML, essa propriedade é responsável por adicionar bordas em qualquer elemento HTML, seja ele uma div, uma imagem, um box, ou seja, qualquer elemento. Abaixo irei listas suas principais propriedades do atributo border.

• border-width: espessura da borda
• border-style: estilo da borda
• border-color: cor da borda
• border-top-width: espessura da borda superior
• border-top-style: estilo da borda superior
• border-top-color: cor da borda superior
• border-right-width: espessura da borda direita
• border-right-style: estilo da borda direita
• border-right-color: cor da borda direita
• border-bottom-width: espessura da borda inferior
• border-bottom-style: estilo da borda inferior
• border-bottom-color: cor da borda inferior
• border-left-width: espessura da borda esquerda
• border-left-style: estilo da borda esquerda
• border-left-color: cor da borda esquerda
• border-top: maneira abreviada para todas as propriedades da borda superior
• border-right: maneira abreviada para todas as propriedades da borda direita
• border-bottom: maneira abreviada para todas as propriedades da borda inferior
• border-left: maneira abreviada para todas as propriedades da borda esquerda
• border: maneira abreviada para todas as quatro bordas

Algumas propriedades só aceitam valores específicos, ou seja, temos que respeitar os valores delas ao passar um parâmetro à ela, esses valores estão listados abaixo:

• color:
• código hexadecimal: #FFFFFF
• código rgb: rgb(255,235,0)
• nome da cor: red, blue, green...etc
• style:
• none: nenhuma borda
• hidden: equivalente a none
• dotted: borda pontilhada
• dashed: borda tracejada
• solid: borda contínua
• double: borda dupla
• groove: borda entalhada
• ridge: borda em ressalto
• inset: borda em baixo relevo
• outset: borda em alto relevo
• width:
• thin: borda fina
• medium: borda média
• thick: borda grossa
• length: uma medida reconhecida pelas CSS (px, pt, em, cm, ...)

Hoje mostrei algumas propriedades que podemos usar nas bordas, e um próximo artigo irei mostrar alguns exemplos de como essas propriedades ficam na prática.

Confira também