CSS可以幫助我們美化網頁,其中之一的常用技巧就是加上下劃線。要添加一半下劃線,我們可以使用CSS中的偽類選擇器來實現。
p { position: relative; } p::after { content: ""; position: absolute; left: 50%; bottom: 0; height: 1px; width: 50%; background-color: black; }
首先,我們需要給要添加下劃線的段落設置定位屬性,這樣我們才能夠使用偽類選擇器。在這個例子里,我們將它的position屬性設置為relative。
接著,我們使用偽類選擇器::after來在段落的結尾處添加一個元素。我們設置這個元素的內容為"",并把它的position屬性設置為absolute,這樣它就跑到了它的父元素p的底部。
接下來,我們使用left屬性把它的左邊緣移動到父元素的中央。我們還設置它的width屬性為50%,以便它只覆蓋了父元素的一半寬度。在這個例子里,我們把它的高度設置為1像素,把它的顏色設置為黑色。
這樣,我們的段落就有了一半下劃線!記得要根據你的設計需要對CSS進行更改。
上一篇css如何添加音頻
下一篇css如何添加可播放音樂