2

i have to make terms and conditions page in html so i want to give them a number but some conditions have their sub point so i want to show them like below example.

  1. me the first point

    1.1 and me the sub point

  2. me the second point

  3. me the third point

  4. me the forth

    4.1 and me the sub point

it is possible to give them such a number format using css

<style>
ol {list-style:decimal}


</style>
</head>

<body>
<ol>

<li>me the first point
<ol><li>me the sub point</li></ol>

</li>
<li>me the second point</li>
<li>me the third point</li>
<li>me the forth point</li>


</ol>

</body>
Reigel Gallarde
  • 64,198
  • 21
  • 121
  • 139
Jitender
  • 7,593
  • 30
  • 104
  • 210
  • You can find an answer here - http://stackoverflow.com/questions/956178/html-css-outline-numbering or here - http://stackoverflow.com/questions/1852816/nested-ordered-lists – Ilia Frenkel Apr 12 '12 at 04:07

5 Answers5

3

You can use CSS counter-increment for this. write like this:

 body{
   counter-reset: chapter 0;
 }
 li{
   counter-reset: sub-chapter 0;
    margin-left:20px;
    position:relative;
 }
 li:before{
   counter-increment: chapter;
   content: counter(chapter) ". ";
 }
 li li:before{
   counter-increment: sub-chapter;
   content: counter(chapter) "." counter(sub-chapter) ": ";
 }
li:before{
    position:absolute;
    left:-20px;
}

Check this http://jsfiddle.net/gNqXL/

It's work till IE8 & above.

sandeep
  • 91,313
  • 23
  • 137
  • 155
2

You can do it with css counters.

http://dev.opera.com/articles/view/automatic-numbering-with-css-counters/

Dan675
  • 1,697
  • 15
  • 15
1

I think this suits your requirement:

http://www.w3schools.com/cssref/pr_gen_counter-reset.asp

Deepak Keswani
  • 117
  • 1
  • 3
0

Terms and Conditions is generally a static page. So it is better to use manual order instead of generating dynamically

Prabhavith
  • 458
  • 1
  • 4
  • 15
0

CSS can do this.

http://caniuse.com/#search=counter

See example.

This may point you in a decent direction.

brains911
  • 1,310
  • 7
  • 5