CSS Border Shorthand

The CSS shorthand border property allows you to set all the individual border properties (border-width, border-style, and border-color) in a single declaration. This can help simplify your CSS code and make it more concise.

border: border-width border-style border-color;

Providing all four sides (top, right, bottom, and left):
Try yourself 
        
            div {
    border: 2px solid red;
    width: 200px;
    height: 100px;
}
You can also specify individual values for each border side:
Try yourself 
        
            div {
   border-width: 1px 2px 3px 4px;
   border-style: solid dashed dotted double;
   border-color: red green blue orange;
   width: 200px;
   height: 100px;
}
You can also specify all the individual border properties for just one side:
Try yourself 
        
            div {
   border-top: 1px solid red;
   width: 200px;
   height: 100px;
}