border proeprty
Border is the shorthand property for border-width, border-style and border-color for all four sides of an element using the values specified.
Syntax:
border:[border-width] [border-style] [border-color];
Eg:
border: 5px solid red;
Unlike the shorthand margin property, you cannot set each border to a different width (or have different colors and styles for each border) using just the shorthand border property.
To specify different values for each side, you’ll need to refer to the property values for the shorthand styles border-width, border-style, and border-color.
As with most shorthand properties, you don’t need to specify all the properties listed, but any omitted properties will revert to their default values. In the case of border-style, if you omit a value no border will show at all, because the default value is none. A border will only be visible as long as the border-style property has been set to something other than none or hidden, or has been restated explicitly after the initial shorthand declaration. Otherwise, no border will show and the border-width will be reset to zero. Therefore, its good practice to specify a value for the border’s style when you’re using shorthand notation.
For more information on box model, see here.
