站長資訊網
css刪除線代碼是“文本元素{text-decoration:line-through;}”。css text-decoration屬性用于規(guī)定添加到文本的修飾，例如下劃線、上劃線、刪除線等；當該屬性的值設置為“l(fā)ine-through”時，可定義穿過文本的一條線，即實現刪除線效果。
前端（vue）入門到精通課程：進入學習
本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
在css中，可以利用text-decoration屬性來實現刪除線效果，實現代碼為：
文本元素{text-decoration:line-through;}
text-decoration 屬性規(guī)定添加到文本的修飾，下劃線、上劃線、刪除線等。
| 值 | 描述 |
|---|---|
| none | 默認。定義標準的文本。 |
| underline | 定義文本下的一條線。 |
| overline | 定義文本上的一條線。 |
| line-through | 定義穿過文本下的一條線。 |
| blink | 定義閃爍的文本。 |
說明：
這個屬性允許對文本設置某種效果，如加刪除線。如果后代元素沒有自己的裝飾，祖先元素上設置的裝飾會“延伸”到后代元素中。不要求用戶代理支持 blink。
代碼示例：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>css添加文本文字的刪除線</title> <style> p{ text-decoration:line-through; } </style> </head> <body> <p>這里有一條刪除線</p> </body> </html>
通過例子可以看出，通過設置text-decoration:line-through;為p元素里的文本文字添加了刪除線，方法簡單、方便。且可以通過css設置簡單修飾刪除線樣式，比如：顏色，例：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>css添加文本文字的刪除線</title> <style> p{ text-decoration:line-through; color: red; } span{ color: black; } </style> </head> <body> <p><span>這里有一條刪除線</span></p> </body> </html>
這樣我們結合text-decoration：line-through和<span></span>樣式定義文本字體顏色的樣式，就可以實現css中刪除線與文字顏色不一的樣式效果，是不是很簡單！
（學習視頻分享：web前端入門）
