<section>
  <h2>見出し</h2>
  <p>1</p>
  <p>2</p>
  <div>3</div>
  <p>4</p>
  <p>5</p>
  <p>6</p>
  <p>7</p>
  <div>8</div>
  <p>9</p>
  <p>10</p>
</section>
section p:nth-child(2){
  color: #ff0000;
}

/* sectionの子・兄弟要素の4番目の要素は「div」なので効かない */
/* つまり p要素の「何個目」という意味ではないことに注意 */
section p:nth-child(4){
  color: #ff0000;
}

/* 8番目の要素を指定しているので「7」が青くなる */
section :nth-child(8){
  color: #0000ff;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.