I HAVE HTML AND CSS LIKE THIS TO WHICH I WANT TO MAKE DESIGN.

jacob rasel

Total Post:88

Points:616
Posted by  jacob rasel
 1097  View(s)
Ratings:
Rate this:
Hi Expert!

How to set red color for number and black color for li content.  ol used for number and li for text content. 
My line of code as following.

CSS

ol li 
{
list-style-type: decimal-leading-zero;
}

HTML

<ol>
<li>One</li>
<li>Two</li>
<li>Three
<ol>
<li>Three.One</li>
<li>Three.Two</li>
</ol>
</li>
<li>Four</li>
</ol>

Please help me! Thanks in advance!
  1. AVADHESH PATEL

    Post:604

    Points:4228
    Re: I have HTML and CSS like this to which i want to make design.

    Hi Jacob!


    <ol>
    <li>One</li>
    <li>Two</li>
    <li>Three
    <ol>
    <li>Three.One</li>
    <li>Three.Two</li>
    </ol>
    </li>
    <li>Four</li>
    </ol>
    The CSS:

    ol li {list-style-type: decimal-leading-zero;}
    ol { counter-reset:li; }
    ol li {
        list-style-type:none;
        counter-increment:li;
        position:relative;
    }
    ol li:before {
        content:counter(li, decimal-leading-zero) ".";
        position:absolute;
        left: -2.6em;
        width: 2em;
        text-align: right;
        color: #f00;
    }

    Hope this helpful for you!

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!