Border Property Shorthand

Three different properties of each border: color, width, and style.

 

• Color :The color can be a hexadecimal number, a keyword, or an RGB value, just like with text.
• Width :A border’s width is the thickness of the line used to draw the border. You can use any CSS measurement type (except percentages) or the keywords thin,medium, and thick.
• Style :The style controls the type of line drawn. There are many different styles, and some look very different from browser to browser.CSS offers these styles: solid, dotted, dashed, double, groove, ridge, inset, outset, none, and hidden.

 

The most basic and straightforward property is border,which simply adds four borders:

border: 4px solid #F00;(The order in which you write the properties doesn’t matter. border: 4px solid #F00; works as well as border: #F00 solid 4px;.)

 

The above style creates a solid, red, 4-pixel border. You can use this property to create a basic frame around a picture, navigation bar, or other item that you want to appear as a self-contained box.