CSS Tutorial - Border

Border Style Types
p.solid {border-style: solid; }
p.double {border-style: double; }
p.groove {border-style: groove; }
p.dotted {border-style: dotted; }
p.dashed {border-style: dashed; }
p.inset {border-style: inset; }
p.outset {border-style: outset; }
p.ridge {border-style: ridge; }
p.hidden {border-style: hidden; }



Border Width
table { border-width: 7px;
border-style: outset; }
td { border-width: medium;
border-style: outset; }
p { border-width: thick;
border-style: solid; }


Border Color
table { border-color: rgb( 100, 100, 255);
border-style: dashed; }

td { border-color: #FFBD32;
border-style: ridge; }

p { border-color: blue;
border-style: solid; }



Border: border-(direction)
p { border-bottom-style: dashed ;
border-bottom-color: yellow;
border-bottom-width: 5px; }

h4 { border-top-style: double;
border-top-color: purple;
border-top-width: thick; }

h5 { border-left-style: groove;
border-left-color: green;
border-left-width: 15px;
border-bottom-style: ridge;
border-bottom-color: yellow;
border-bottom-width: 25px; }



Border: All in One
p { border: 20px outset blue ;}
h4{ border: 5px solid; }
h5{ border: dotted; }