CSS counter() ఫంక్షన్

నిర్వచనం మరియు వినియోగం

counter() ఫంక్షన్ ప్రస్తావించబడిన కౌంటర్ ప్రస్తుత విలువను స్ట్రింగ్ రూపంలో తిరిగి ఇస్తుంది.

ఉదాహరణ

ఉదాహరణ 1

పేజీకి కౌంటర్ సృష్టించండి (body సెలెక్టర్ లో). ప్రతి <h2> ఎలమెంట్కు కౌంటర్ విలువను జోడించండి మరియు ప్రతి <h2> ఎలమెంట్ ముందుగా "విభాగం ఎన్నింటిలో" పదాన్ని జోడించండి:

body {
  counter-reset: section;
}
h2::before {
  counter-increment: section;
  content: "Section " counter(section) ": ";
}

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 2

కౌంటర్ స్టైల్ సెట్ చేయండి:

body {
  counter-reset: section;
}
h2::before {
  counter-increment: section;
  content: "Section " counter(section, upper-roman) ": ";
}

స్వయంగా ప్రయత్నించండి

CSS సంకేతాలు

counter(countername, counterstyle)
విలువ వివరణ
countername

అవసరం. కౌంటర్ పేరు (కౌంటర్-రీసెట్ మరియు కౌంటర్-ఇన్క్రీమెంట్ అట్రిబ్యూట్లులో ఉపయోగించబడే పేరు తో సమానంగా ఉంటుంది).

గమనించండి, పేరు క్షీణాత్మకంగా ఉంటుంది.

counterstyle

ఎంపికలు. కౌంటర్ స్టైల్ (లిస్ట్-స్టైల్-టైప్ విలువలు, @counter-style పేరు లేదా symbols() ఫంక్షన్).

డిఫాల్ట్ విలువ దశమాకంగా ఉంటుంది.

సాంకేతిక వివరాలు

వెర్షన్: CSS3

బ్రౌజర్ మద్దతు

క్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఆపెరా
支持 支持 支持 支持 支持

相关页面

教程:CSS కౌంటర్

సూచనలు:CSS కంటెంట్ అట్రిబ్యూట్

సూచనలు:CSS కంట్రా ఇన్క్రీమెంట్ అట్రిబ్యూట్

సూచనలు:CSS కంట్రా రీసెట్ అట్రిబ్యూట్

సూచనలు:CSS @counter-style రూల్

సూచనలు:CSS counters() ఫంక్షన్