CSS Box model border

1 <! DOCTYPE html>2 3 4 <meta charset= "UTF-8" >5 <title>Document</title>6 <style type= "Text/css" >7 . Box{8 width:300px;9 Height:390px;Ten Background-color:Pink; One Border-top-style:Solid;/*Linetype*/ A Border-top-color:Red;/*Top Border Color*/ - Border-top-width:5px;/*Top Border thickness*/ -  the Border-bottom-style:dotted;/*Point Line*/ - Border-bottom-color:Blue; - Border-left-style:Dashed;/*Dashed Lines*/ - Border-left-color:#467890; +             /*four borders are the same*/ - Border:5px Solid Blue; +} A </style> at  - <body> - <div class= "box" > Distance </div> - </body> - 

CSS Box Model:
1. Border border
Border-top-style(line): Solid (solid)
Dotted (point line)
Dashed (dashed line)
Border-top-color (border color)
Border-top-width (border thickness)

2. The Border property shorthand:
border-top:5px solid red;
Features: No sequential restrictions. Line type must be written
Four when the border is the same, the wording:
border:5px Solid Red
Features: no order required. Line type is a must-write item

CSS Box model border