在網頁設計中,我們可能會遇到需要在文本中劃掉一些內容的情況,比如展示舊價格等。在CSS中,我們可以很方便地通過添加text-decoration屬性來實現該效果。
p { text-decoration: line-through; }
上述代碼可以將所有p標簽中的文字設置為劃掉狀態。除了line-through,text-decoration還支持其他幾種值:
- underline:下劃線
- overline:上劃線
- none:無特殊裝飾
- blink:閃爍文本(非標準屬性,不建議使用)
如果想只對某個文本進行劃掉,可以使用標簽,并為其添加樣式:
原價:100元
.old-price { text-decoration: line-through; }
通過單獨為某個標簽添加樣式,我們可以只將該標簽中的內容設置為劃掉狀態。
上一篇css設置文字在頂部
下一篇css添加可編輯區