css文字上的橫線(xiàn)是怎么實(shí)現(xiàn)的

本篇文章給大家分享的是有關(guān)css文字上的橫線(xiàn)是怎么實(shí)現(xiàn)的，小編覺(jué)得挺實(shí)用的，因此分享給大家學(xué)習(xí)，希望大家閱讀完這篇文章后可以有所收獲，話(huà)不多說(shuō)，跟著小編一起來(lái)看看吧。

本教程操作環(huán)境：windows10系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

css文字上的橫線(xiàn)怎么寫(xiě)

在css中，可以利用text-decoration屬性來(lái)設(shè)置字上的橫線(xiàn)，當(dāng)屬性的值為line-through時(shí)，定義了一個(gè)穿過(guò)文本的一條線(xiàn)。

1、新建一個(gè)html文件，命名為test.html，用于講解在html里，用css怎么在字的中間加一條橫線(xiàn)。使用p標(biāo)簽創(chuàng)建一行文字，文字內(nèi)容為“用css在字的中間加一條橫線(xiàn)”。給p標(biāo)簽設(shè)置class屬性，屬性值為myp，主要用于下面通過(guò)該class來(lái)設(shè)置css樣式。編寫(xiě)<style type="text/css"></style>標(biāo)簽，頁(yè)面的css樣式將寫(xiě)在該標(biāo)簽內(nèi)。通過(guò)p標(biāo)簽的class屬性myp來(lái)設(shè)置p標(biāo)簽內(nèi)文字的css樣式，樣式寫(xiě)在花括號(hào)內(nèi)。

2、在css標(biāo)簽內(nèi)，在花括號(hào)內(nèi)，將text-decoration屬性設(shè)置為line-through，實(shí)現(xiàn)給文字中間加一條橫線(xiàn)的效果。

在瀏覽器打開(kāi)test.html文件，查看實(shí)現(xiàn)的效果。

總結(jié)：

1、創(chuàng)建一個(gè)test.html文件。

2、在文件內(nèi)，使用p標(biāo)簽創(chuàng)建一行測(cè)試的文字。

3、在css中，將p標(biāo)簽的樣式屬性text-decoration設(shè)置為line-through，實(shí)現(xiàn)在字的中間加一條橫線(xiàn)的效果。

以上就是css文字上的橫線(xiàn)是怎么實(shí)現(xiàn)的，小編相信有部分知識(shí)點(diǎn)可能是我們?nèi)粘９ぷ鲿?huì)見(jiàn)到或用到的。希望你能通過(guò)這篇文章學(xué)到更多知識(shí)。更多詳情敬請(qǐng)關(guān)注億速云行業(yè)資訊頻道。