<div>
  <pre>:nth-of-type(1)</pre>
  <ul class="one">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
    <li>Five</li>
    <li>Six</li>  
    <li>Seven</li>
    <li>Eight</li>
  </ul>
</div>

<div>
  <pre>:nth-of-type(odd)</pre>
  <ul class="two">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
    <li>Five</li>
    <li>Six</li>
    <li>Seven</li>
    <li>Eight</li>
  </ul>
</div>

<div>
  <pre>:nth-of-type(3n+2)</pre>
  <ul class="three">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
    <li>Five</li>
    <li>Six</li>
    <li>Seven</li>
    <li>Eight</li>
  </ul>
</div>

body {
  padding: 1em 2em;
}

ul {
  list-style: none;
  width: 12em;
  border: 1px solid #444;
  padding: 0
}
li {
  text-align: center;
  line-height: 2;
  background: slategrey;
}
div {
  float: left;
  margin-right: 2em;
}
pre {
  font-size: 14px;
}
hr {
  clear: both;
  padding-top: 1em;
  border: 0;
  border-bottom: 1px solid grey;
}

.one li:nth-of-type(1) {
  background: lightsteelblue;
}

.two li:nth-of-type(odd) {
  background: lightsteelblue;
}

.three li:nth-of-type(3n+2) {
  background: lightsteelblue;
}