色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

ol增加數字序列 css

江奕云1年前11瀏覽0評論

數字序列是一種常見的排版方式,它可以快速展示一組有序的數據。對于使用ol(有序列表)標簽進行標記的內容,我們可以通過 CSS 樣式屬性來修改數字序列顯示的方式。

ol {
list-style: none;
counter-reset: my-counter;
}
ol li:before {
content: counter(my-counter);
counter-increment: my-counter;
display: inline-block;
width: 20px;
text-align: right;
margin-right: 5px;
}

代碼中的list-style: none;將有序列表的默認樣式去掉,counter-reset: my-counter;則是將計數器初始值設置為0。其中my-counter是自定義的計數器名字,在后續的代碼中將會多次使用。

接下來是對 ol li 子元素前的數字進行樣式修飾的 CSS 屬性。使用:before偽類可以在li元素前插入內容表現為數字顯示。content: counter(my-counter);就是將計數器的值插入到li:before中,counter-increment: my-counter;則使得每次插入后計數器加一。

最后,樣式中的display: inline-block;width: 20px;以及text-align: right;margin-right: 5px;則是對數字的樣式進行修飾,以便實現自定義的數字序列。