CSS Outline Shorthand

CSS Outline Shorthand

CSS Outline Shorthand 
As per now we were writing css outline properties separately for 
  1. color, 
  2. width, and 
  3. Style
Which was taking many lines and more time-consuming.
But through the CSS outline property, we can do that all in one line.
Note - 
CSS shorthand properties are recommended when you have a grip on other outline properties as well.
Outline property order does not matter.
Syntax - 
outline : value1 value2 value3;
Now we will see Example - 
Example - 
<!DOCTYPE html>
<html lang="en">
outline: dotted palevioletred thick;
  outline: 8px solid rgb(0, 153, 255) ;
outline: thick ridge rgb(248, 17, 152);

<link rel="stylesheet" href="sample.css">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<p class="p1">this is a pera</p>
<p class="p2">this is a pera</p>
<p class="p3">this is a pera</p>
<p class="p4">this is a pera</p>
Output -