[CSS] 利用 text-decoration 設定文字的裝飾(底線、刪除線、上方線 )方式

利用 CSS 去做文字的裝飾，會使用 text-decoration，基本上可以有上方的線(overline)、刪除線(line-through)和底線(underline)。

.overline{
  text-decoration: overline;
}
.line-through{
  text-decoration: line-through;
}
.underline{
  text-decoration: underline;
}

像是：

text-decoration 也可以加上顏色，像是這樣：

.overline{
  text-decoration: overline red;
}
.line-through{
  text-decoration: line-through blue;
}
.underline{
  text-decoration: underline green;
}

線條可以加上樣式，有 wavy、solid 跟 dashed 可以用：

.overline{
  text-decoration: wavy overline red;
}
.line-through{
  text-decoration: solid line-through blue;
}
.underline{
  text-decoration: dashed underline green;
}

線條可以調整粗細，再加上數值即可：

.underline{
  text-decoration: solid underline green 4px;
}

也可以一次設定多種線條，但要注意順序：

.underline{
  text-decoration: dashed underline overline green;
}