這篇文章主要為大家展示了“css如何實(shí)現(xiàn)自動(dòng)編號(hào)”,內(nèi)容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“css如何實(shí)現(xiàn)自動(dòng)編號(hào)”這篇文章吧。
創(chuàng)新互聯(lián)建站于2013年成立,是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司,擁有項(xiàng)目成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作網(wǎng)站策劃,項(xiàng)目實(shí)施與項(xiàng)目整合能力。我們以讓每一個(gè)夢(mèng)想脫穎而出為使命,1280元臨河做網(wǎng)站,已為上家服務(wù),為臨河各地企業(yè)和個(gè)人服務(wù),聯(lián)系電話:028-86922220
一、自動(dòng)編號(hào)
在CSS2.1中的自動(dòng)編號(hào)由兩個(gè)屬性控制,它們分別為:“counter-increment”和“counter-reset”。由這些屬性定義的計(jì)數(shù)器(counter)與“content”屬性的counter()和counters()函數(shù)一起使用。
'counter-increment'
語法:
counter-increment:[<identifier><integer>?]+|none|inherit
說明:
初始:沒有
適用于:所有元素
繼承:沒有
百分比:N/A
媒體:所有
計(jì)算值:作為指定
counter-increment'屬性接受的計(jì)數(shù)器(標(biāo)識(shí)符)的一個(gè)或多個(gè)名稱,每一個(gè)名稱可選地跟隨一個(gè)整數(shù)。整數(shù)表示每次出現(xiàn)元素時(shí)計(jì)數(shù)器的遞增程度,默認(rèn)增量為1,允許零和負(fù)整數(shù)。
'counter-reset'
語法:
counter-reset:[<identifier><integer>?]+|none|inherit
說明:
初始:沒有
適用于:所有元素
繼承:沒有
百分比:N/A
媒體:所有
計(jì)算值:作為指定
counter-reset屬性包含計(jì)數(shù)器的一個(gè)或多個(gè)名稱,每一個(gè)名稱可選地任選地跟隨一個(gè)整數(shù)的列表。整數(shù)給出每次出現(xiàn)元素時(shí)計(jì)數(shù)器設(shè)置的值。默認(rèn)值為0。
注:關(guān)鍵字'none','inherit'和'initial'不得用作計(jì)數(shù)器名稱;值'none'本身意味著沒有重置計(jì)數(shù)器,'inherit'本身具有其通常的含義(繼承),“initial”保留供將來使用。
例:顯示了使用“第1章”,“1.1”,“1.2”等對(duì)章節(jié)進(jìn)行編號(hào)的方法。
html代碼:
<h2>大標(biāo)題</h2>
<h3>小標(biāo)題1</h3>
<h3>小標(biāo)題2</h3>
css代碼:
body{
counter-reset:chapter;/*創(chuàng)建章節(jié)計(jì)數(shù)器范圍*/
}
h2:before{
content:"第"counter(chapter)"章、";
counter-increment:chapter;/*在章節(jié)中添加1*/
}
h2{
counter-reset:section;/*將部分設(shè)置為0*/
}
h3:before{
content:counter(chapter)"."counter(section)"";
counter-increment:section;
}
以上是“css如何實(shí)現(xiàn)自動(dòng)編號(hào)”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對(duì)大家有所幫助,如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!
分享題目:css如何實(shí)現(xiàn)自動(dòng)編號(hào)
本文鏈接:http://vcdvsql.cn/article30/gdjdpo.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站排名、動(dòng)態(tài)網(wǎng)站、全網(wǎng)營銷推廣、微信公眾號(hào)、做網(wǎng)站、ChatGPT
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)