CSS border Shorthand
CSS border shorthand is used to write border properties in one line.
In most cases, you want to define several border properties (border-width, border-style, and border-color) for all sides of an element.
Instead of writing -
border-width: 1px;
border-style: solid;
border-color: #ff0000;
|
You can simply write -
border: 1px solid #ff0000;
|
These shorthands are also available for every side of an element: border-top, border-left, border-right, and border-bottom.
So we can do-
border-top: 2px double #aaaaaa;
|
Now we will see Example -
Example -
Output -
Now we will see the shorthand property
Example -
This will produce same output as the above example
Output -