Different values for the text-decoration in CSS

In our last video, we learned about how we can specify a color for the text-decoration property in CSS. If you have missed that video, the link is given here: https://www.youtube.com/watch?v=cVGhoea2D88

<!DOCTYPE html>
<html>
<head>
<style>

#p1 {
  text-decoration:  underline green;
}
#p2 {
  text-decoration:  line-through pink;
}
#p3 {
  text-decoration:  overline yellow;
}
#p4 {
  text-decoration: underline overline line-through greenyellow;
}
#p5 {
  text-decoration: wavy underline blue;
}
#p6 {
  text-decoration: underline overline line-through wavy blueviolet;
}
#p7 {
  text-decoration: none;
}

</style>
</head>
<body>

    <p id="p1">underline</p>
    <p id="p2">line-through</p>
    <p id="p3">overline</p>
    <p id="p4">underline overline line-through</p>
    <p id="p5">wavy underline</p>
    <p id="p6">underline overline line-through wavy</p>
    <p id="p7">none</p>

</body>
</html>