CSS 排序下劃線
在 CSS 中,可以使用偽類選擇器來添加排序下劃線樣式。
首先,為排序列表添加以下樣式:
ol { counter-reset: my-counter; } li:before { content: counter(my-counter); counter-increment: my-counter; }
這將為排序列表中每個列表項添加數字標記。
現在,可以使用::after
偽元素為數字標記添加下劃線:
li::after { content: '_'; text-decoration: underline; }
這將在數字后添加下劃線,方便閱讀和查看。
如果想要更改下劃線的樣式,可以通過border-bottom
屬性來設置下劃線的線條寬度、顏色和樣式:
li::after { content: ''; display: block; margin-top: 10px; border-bottom: 1px solid black; }
在上面的代碼中,使用了margin-top: 10px;
屬性來為下劃線添加一些垂直間距。
最終效果如下:
- 第一項
- 第二項
- 第三項
通過上面的 CSS 樣式,可以為排序列表添加數字標記和下劃線,并通過自定義樣式來使其更加美觀。
上一篇php 如何做三級分銷
下一篇css排成一行