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.