CSS 选择器

后代选择器

container p #选择所有后代 container为父容器的选择器 p表示子元素选择器 中间用空格隔开
P:first-child #选择后代第一个元素
P:last-child #选择后代最后一个元素
P:nth-child(n) #选择后代第n个选择
html代码：

<div class="container">
      <div>item1</div>
      <div>item2</div>
      <div>item3</div>
      <div>item4</div> 
</div>

css代码：

.container {  //选择父容器
  background-color: red;
}
.container div{ //选择所有子元素
  margin-top:10px; 
}
.container div:first-child {  //选择第一个子元素
  background-color: blue;
}
.container div:last-child { //选择最后一个子元素
  background-color: pink;
}
.container div:nth-child(2) { //选择第二个子元素
  background-color: green;
}