CSS text-decoration-style Property - Playground Example

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
 p {
 text-decoration : underline ;  / * add text decoration for paragraphs (line below) * /
 font-size : 24px ;  / * set the font size for paragraphs * /
 }
.test {
   -webkit-text-decoration-style: solid; 
   -moz-text-decoration-style: solid; 
   text-decoration-style: solid; 
}
.test2 {
   -webkit-text-decoration-style: double;
   -moz-text-decoration-style: double;
   text-decoration-style: double; 
}
.test3 {
   -webkit-text-decoration-style: dotted; 
   -moz-text-decoration-style: dotted; 
   text-decoration-style: dotted; 
}
.test4 {
   -webkit-text-decoration-style: dashed;
   -moz-text-decoration-style: dashed; 
   text-decoration-style: dashed;
}
.test5 {
   -webkit-text-decoration-style: wavy; 
   -moz-text-decoration-style: wavy;
   text-decoration-style: wavy; 
}
</style>
</head>
<body>
<p class="test"> text-decoration-style: solid;  </p> 
<p class="test2"> text-decoration-style: double;  </p> 
<p class="test3"> text-decoration-style: dotted;  </p> 
<p class="test4"> text-decoration-style: dashed;  </p> 
<p class="test5"> text-decoration-style: wavy;  </p> 
</body>
</html>