0

PROPRIEDADES CSS – BORDER

cssPropriedades Border

A propriedade Border define os tipos de bordas que podem ser associados a uma página, bloco de texto ou a um elemento.

As propriedades para as bordas são as listadas abaixo:

Propriedade Efeito
border-width: espessura da borda.
border-style: 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 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

 Valores válidos para as propriedades das bordas

  • 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, …)

Existem vários estilos de bordas, definidos pela marcação border-style. Visualize no exemplo abaixo:

 Resultado:

bordascss

 

Paulo R. Marinho

Deixe uma resposta

O seu endereço de email não será publicado Campos obrigatórios são marcados *

− 5 = 2