ul-li-alternation-color

ul-li-alternation-color

HTML

<ul class="top-list">
    <li><div>Пункт 1</div>
        <ul>
            <li><div>Пункт 1.1</div>
                <ul>
                    <li><div>Пункт 1.1.1</div></li>
                    <li><div>Пункт 1.1.2</div></li>
                    <li><div>Пункт 1.1.3</div></li>
                    <li><div>Пункт 1.1.4</div></li>   
                    <li><div>Пункт 1.1.5</div></li>
                </ul>
            </li>
            <li><div>Пункт 1.2</div></li>
        </ul>
    </li>
    <li><div>Пункт 2</div>
        <ul>
            <li><div>Пункт 2.1</div>
             <ul>
                    <li><div>Пункт 2.1.1</div></li>
                    <li><div>Пункт 2.1.2</div></li>
                    <li><div>Пункт 2.1.3</div></li>
                 <li><div>Пункт 2.1.4</div></li>
                </ul>
            </li>
            <li><div>Пункт 2.2</div></li>
            <li><div>Пункт 2.3</div></li>
            <li><div>Пункт 2.4</div></li>
        </ul>
    </li>
    <li><div>Пункт 3</div>
        <ul>
            <li><div>Пункт 3.1</div></li>
            <li><div>Пункт 3.2</div></li>
        </ul>
    </li>
</ul>

CSS

ul {
   list-style: none; 
}
ul > li {
    border: 1px #000 solid;
    margin: 5px 0 5px 20px
}
.top-list > li:nth-of-type(odd) > div,
.top-list > li:nth-of-type(odd) li:nth-of-type(even) > div,
.top-list > li:nth-of-type(even) li:nth-of-type(odd) > div,
.top-list > li:nth-of-type(odd) ul ul li:nth-of-type(odd) > div,
.top-list > li:nth-of-type(even) ul ul li:nth-of-type(even) > div{
    background: red;
}
.top-list > li:nth-of-type(even) > div,
.top-list > li:nth-of-type(odd) li:nth-of-type(odd) > div,
.top-list > li:nth-of-type(even) li:nth-of-type(even) > div,
.top-list > li:nth-of-type(odd) ul ul li:nth-of-type(even) > div,
.top-list > li:nth-of-type(even) ul ul li:nth-of-type(odd) > div{
    background: yellow;
}