Is it possible to add subitems into an ordered list?

ol { counter-reset: item }
li { display: block }
li:before { content: counters(item, ".") " "; counter-increment: item }

           <ol>
        <li>First level</li>
        <li>First level 2
            <ol>
                <li>Second level</li>
                <li>Second level 2
                    <ol><li>Third level</li></ol>
                </li>
            </ol>
        </li>           
    </ol>

1. First level
2. First level 2
    2.1 Second level
    2.2 Second level 2
           2.2.1 Third level

Your best bet to differentiate nested lists is to specify a different type:

<ol type="1">
    <li>One</li>
    <li>Two
        <ol type="a">
            <li>Two point One</li>
            <li>Two point Two</li>
        </ol>
    </li>
    <li>Three</li>
    <li>Four</li>
</ol>

I don't think it's possible to have a nested numbering (such as 2.1 or 2.1.3).

You can also use the CSS attribute list-style-type to indicate the type (e.g. upper-latin for 1,2,...; upper-roman for I,II,...; lower-alpha for a,b,...; etc.).

Yes.

    <ol>
      <li>One</li>
      <li>Two
        <ol>
          <li>Two point one</li>
          <li>Two point two</li>
        </ol>
      </li>
      <li>Three</li>
      <li>Four</li>
   </ol>

I needed to pull together a Harvard-style outline the other day for a project. Here's the relevant CSS:

ol li { list-style-type: upper-roman; }
ol li ol li { list-style-type: upper-alpha; }
ol li ol li ol li { list-style-type: decimal; }
ol li ol li ol li ol li { list-style-type: lower-latin; }
ol li ol li ol li ol li ol li { list-style-type: lower-roman; }

You could of course swap these for <ul>s, but a sequential outline is an ordered list.

You can nest lists.

ul
li  /li
li
  ul
     li
     li
  /ul
/li

li /li /ul

If you see what I mean :)

Not exactly what he wants though. Perhaps this is helpful? http://stackoverflow.com/questions/602667/sub-items-in-ordered-lists-for-ie6-and-ie7

nested ordered lists can also have a start number, but you'll need to be inventive to get the point numbering. i.e. <ol start="2"> will have numbers starting from 2

Hello! As people above wrote it is not really possible with HTML/CSS only (actually it is, but there will be no cross-browser solvation to the problem, as soon as IE6 doesn't suppot some CSS 2.1 stuff). But with addition of some JS dreams come true :) The code inserting here sucks, so I created a snippet at snipplr.com. The code and the example.

You could do this with a small bit of jQuery.

Mark up your list as so:

<ol>
  <li>Chapter 1</li>
  <li>Chapter 2
    <ol>
      <li>Verse 1</li>
      <li>Verse 2</li>
    </ol>
  </li>
  <li>Chapter 3</li>
  <li>Chapter 4</li>
  <li>Chapter 5</li>
</ol>

Then add this jQuery snippet:

$("li:has(ol)").each(function(){
    // parent index
    var i = $(this).prev().length + 1;

    $(this).children("ol")
    // set css
    .addClass('numbered')
    .children("li").each(function(j){
      $(this).prepend('<span class="list">'+i+'.'+(j+1)+'.</span>');
    });
  });

And these CSS rules (these apply to browser defaults, edit as appropriate):

ol.numbered { list-style:none; padding-left: 20px; }
span.list { margin-right: 10px; }

At the moment this will only work for one level of indentation, and it could be packaged up into a nice plugin.

Great responses here, thanks!

I'd prefer not to use JavaScript but the jQuery approach is nice. Also, whilst Joost van der Borg's answer was the most accurate and received my "best answer" star, I actually used Nikki Erwin Ramirez's approach - using lower-roman numbering for my sublist - in my code.

Thanks everybody.