In this article I will talk about the border property of the html, this property is responsible for adding borders in any html element, be it a div, an image, a box, or any element.
I'll list the main properties of the border attributes below:
Note: As you can see, the names of properties are very suggestive
- border-width:----------------border width
- border-style:----------------border style
- border-color:----------------border color
- border-top-width:------------top border width
- border-top-style:------------top border style
- border-top-color:------------top border color/li>
- border-right-width:----------right border width
- border-right-style:----------right border style
- border-right-color:----------right border color
- border-bottom-width:---------bottom border width
- border-bottom-style:---------bottom border style
- border-bottom-color:---------bottom border color
- border-left-width:----------left border width
- border-left-style:----------left border style
- border-left-color:----------left border color
- border-top:------abbreviated form for all the border top properties
- border-right:----abbreviated form for all the border right properties
- border-bottom:---abbreviated form for all the border bottom properties
- border-left:-----abbreviated form for all the border left properties
- border:----------abbreviated form for all the border properties
Some properties just accepts specific values. So, we have to respect their values to pass a parameter to it, these values are listed below:
- color:
- hexadecimal code: #FFFFFF
- rgb code: rgb(255,235,0)
- color name: red, blue, green...etc
- style:
- none: no border
- hidden: border hidden
- dotted: dotted border
- dashed: dashed border
- solid: solid border
- double: double border
- groove: groove border
- ridge: border in ledge
- inset: border in low relief
- outset: border in high relief
- width:
- thin: thin border
- medium: medium border
- thick: thick border
- length: a recognized measure by CSS (px, pt, em, cm, ...)
Today I showed some properties that we can use in the borders and in the next article I'll show some examples of how these properties are in practice.
See you in the next article
Ricardo Arrigoni - Front-End Developer and SEO Analyst