<h2>انتخاب محدوده عناصر با css</h2>

<ol class="ol">
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
    <li>List item example</li>
  </ol>

<p>انتخابگر <code>li:nth-child(n+7):nth-child(-n+14)</code> آیتم های 7 تا 14 را انتخاب می کند .</p>
body {direction:rtl;
  padding: 0 20px;
  text-align: center;
  line-height: 1.3;
}

ol {
  max-width: 185px;
  margin: auto;
}

.ol li:nth-child(-n+14):nth-child(n+7) {
  background: lightpink;
}

.p {
  font-family: Arial, sans-serif;
  font-size: 14px;
  padding-top: 130px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.