border shorthand code example

Example 1: css border shorthand

#selector{
    /*The format is border:width style color;*/
    border:2px solid grey;
}

Example 2: dashed lin in css

hr {
  border:none;
  border-top:1px dashed #f00;
  color:#fff;
  background-color:#fff;
  height:1px;
  width:50%;
}

Example 3: border style shorthand

a quick note on border-style shorthand:

  border-style: none none dotted; --> this means: 
  
   One value: it applies the same style to all four sides.
   Two values: applies to top and bottom, the second to the left and right.
   Three values: applies to the top, the second to the left and right, the third to the bottom.
   Four values: applies to all four sides following clockwise.