首頁 > web前端 > css教學 > css字體劃線如何設定?文字加中劃線方法

css字體劃線如何設定?文字加中劃線方法

云罗郡主
發布: 2018-11-22 15:52:32
轉載
15898 人瀏覽過

這篇文章帶給大家的內容是關於css字體劃線如何設定?文字加中劃線方法,有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。

css佈局設定文字劃線樣式-字體文字加中劃線佈局

在淘寶、京東等網上商城上看見原價文字劃線,打折文字不中劃線的佈局。

css字體劃線如何設定?文字加中劃線方法

一、文字中劃線CSS與HTML標籤兩種

1、CSS屬性單字與程式碼

單字:text-decoration

中劃線值

text-decoration:line-through

2、HTML中劃線標籤

S標籤

被加中劃線

二、文字中劃線div css實例

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>文字加中划线实例</title>
<style>
.zhx{ text-decoration:line-through}
</style>
</head>
<body>
<p>原价:¥<span class="zhx">200.00</span><br />
现价:¥120.00</p>
</body>
</html>
登入後複製

效果如下:

css字體劃線如何設定?文字加中劃線方法

CSS設定text-decoration:line-through中劃線樣式。
對原價的數字,加class引入中劃線css樣式。

以上就是對css字體劃線如何設定?文字加中劃線方法的全部介紹,如果您想了解更多有關CSS3教程,請關注PHP中文網。


以上是css字體劃線如何設定?文字加中劃線方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:thinkcss.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板