W3Context Online Editor v1.1

<!DOCTYPE html>
<html lang="en">
<head>
 <title>CSS border-style Example</title>
 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 <meta charset="utf-8" />
 <style>
 .p1 {
 border-style: none;
 }
 .p2 {
 border-style: hidden;
 }
 .p3 {
 border-style: dotted;
 border-color: red;
 }
 .p4 {
 border-style: dashed;
 border-color: black;
 }
 .p5 {
 border-style: solid;
 }
 .p6 {
 border-style: double;
 }
 .p7 {
 border-style: groove;
 }
 .p8 {
 border-style: ridge;
 }

.p9 {
 border-style: inset;
 }
 .p10 {
 border-style: outset;
 }
 </style>
</head>
<body>
 <h1>CSS border-style Example</h1>
 
 The example of none border.
 
 
 The example of hidden border.
 
 
 The example of dotted border.
 
 
 The example of dashed border.
 
 
 The example of solid border.
 
 
 The example of double border.
 
 
 The example of groove border.
 
 
 The example of ridge border.
 
 
 The example of inset border.
 
 
 The example of outset border.
 
</body>
</html>