使用css樣式對一段文字或一段文字中其中幾個文字設(shè)置虛線效果的下劃線如何實現(xiàn)？我們知道css字體下劃線使用text-decoration樣式實現(xiàn)，而虛線下劃線則不能使用此css樣式屬性。要實現(xiàn)通過下邊框border-bottom實現(xiàn)虛線邊框來制作出虛線下劃線效果。那么一起來了解一下。

css下劃線——淺談css自定義下劃線

自定義下劃線。使用:after，首先添加一個空的內(nèi)容，為了讓它排列到標題的下面，需要將其變成塊級元素，用border-bottom設(shè)置下劃線，可設(shè)置其顏色、粗細，下劃線的長度通過設(shè)置空內(nèi)容的width屬性來實現(xiàn)，還可以通過margin-top調(diào)整下劃線與文字的距離。

css語言特點

css為html標記語言提供了一種樣式描述，定義了其中元素的顯示方式。css在web設(shè)計領(lǐng)域是一個突破。利用它可以實現(xiàn)修改一個小的樣式更新與之相關(guān)的所有頁面元素。

總體來說，css具有以下特點：

豐富的樣式定義

css提供了豐富的文檔樣式外觀，以及設(shè)置文本和背景屬性的能力；允許為任何元素創(chuàng)建邊框，以及元素邊框與其他元素間的距離，以及元素邊框與元素內(nèi)容間的距離；允許隨意改變文本的大小寫方式、修飾方式以及其他頁面效果。

易于使用和修改

css可以將樣式定義在html元素的style屬性中，也可以將其定義在html文檔的header部分，也可以將樣式聲明在一個專門的css文件中，以供html頁面引用。總之，css樣式表可以將所有的樣式聲明統(tǒng)一存放，進行統(tǒng)一管理。

另外，可以將相同樣式的元素進行歸類，使用同一個樣式進行定義，也可以將某個樣式應(yīng)用到所有同名的html標簽中，也可以將一個css樣式指定到某個頁面元素中。如果要修改樣式，我們只需要在樣式列表中找到相應(yīng)的樣式聲明進行修改。

css的多頁面應(yīng)用

css樣式表可以單獨存放在一個css文件中，這樣我們就可以在多個頁面中使用同一個css樣式表。css樣式表理論上不屬于任何頁面文件，在任何頁面文件中都可以將其引用。這樣就可以實現(xiàn)多個頁面風格的統(tǒng)一。

層疊

簡單的說，層疊就是對一個元素多次設(shè)置同一個樣式，這將使用最后一次設(shè)置的屬性值。例如對一個站點中的多個頁面使用了同一套css樣式表，而某些頁面中的某些元素想使用其他樣式，就可以針對這些樣式單獨定義一個樣式表應(yīng)用到頁面中。這些后來定義的樣式將對前面的樣式設(shè)置進行重寫，在瀏覽器中看到的將是最后面設(shè)置的樣式效果。

頁面壓縮

在使用html定義頁面效果的網(wǎng)站中，往往需要大量或重復(fù)的表格和font元素形成各種規(guī)格的文字樣式，這樣做的后果就是會產(chǎn)生大量的html標簽，從而使頁面文件的大小增加。而將樣式的聲明單獨放到css樣式表中，可以大大的減小頁面的體積，這樣在加載頁面時使用的時間也會大大的減少。另外，css樣式表的復(fù)用更大程序的縮減了頁面的體積，減少的時間。

對字體文字實現(xiàn)虛線的下劃線樣式布局不是采用常規(guī)下劃線屬性text-decoration實現(xiàn)，而是通過邊框border樣式的下邊框border-bottom的虛線邊框樣式來實現(xiàn)。如果大家還想了解更多與之有關(guān)的信息，歡迎關(guān)注我們文軍營銷的官網(wǎng)。

推薦閱讀