p標簽代碼:
CSS中的下滑虛線可以用border-bottom屬性表示,但它的樣式和默認的下劃線樣式不同。
我們可以在border-bottom屬性中設置border-style為dashed或dotted來表示虛線。同時,還可以設置虛線的寬度和顏色。
例如:
text-decoration: none; border-bottom: 1px dashed #000;
上述代碼表示去掉下劃線,并在文字下方繪制1像素寬的黑色虛線。
如果要實現不同的虛線樣式,可以調整border-style屬性的值。其中dotted表示點狀虛線,double表示雙線,solid表示實線等等。
下滑虛線也可以通過偽元素:before或:after來實現。具體方法是給偽元素添加border-bottom屬性,然后將內容position為relative,再將偽元素position為absolute即可。
例如:
.underline-text { position: relative; display: inline-block; } .underline-text:before { position: absolute; content: ""; bottom: -5px; width: 100%; height: 2px; border-bottom: 1px dashed #000; }
上述代碼表示在類名為underline-text的元素下方繪制一條1像素寬的黑色虛線。
上一篇css中下劃線代碼