有一个比较有用的选择器子选择器，即大于符号(>),用于选择指定标签元素的第一代子元素。
如代码编辑器中的代码：
.food>li{border:1px solid red;}
这行代码会使class名为food下的子元素li加入红色实线边框。
>这个“选择指定标签元素的第一代子元素”就是让样式只作用于它的孩子，不作用于他的孙子。
举个例子:
“ 他们对自己的经历缺乏热情
“经历”虽然是用span包的，但它是“p class="first"”的孙子，
它包在前一个span的里面（就是它孩子的里面），所以样式对它不起作用。
如果把“>”改为空格，就会发现两个span都有边框了。空格用于元素的所有后代的。
空格是适用于所有对应元素，而>则是适用于下一代，并且可以连续使用，即.first>span>span
感觉如果将编程比喻成一场战争，而不同的语言就是代表不同的兵种，兵种之下就是一群有着自己个性的士兵。我们学习的html和css还有js就是三个不同的兵种了，它们的标签语言代表了一群有着不同个性的士兵。
现在我们作为统帅，要学会的就是让他们之间相互配合，接着就是不同兵种不同个性的士兵需要我们去沟通用不同的方式去和他们交流，随着时间的前进，这些沟通的方式演变成了不同的套路，而我们现在要学会的就是使用这些套路去让它们帮我们赢得战争，如此而已。
如果将我们比作统帅，选择器就是发布命令的方法，作为统帅当然是希望将命令发布到每个士兵（标签）手中，让他们能够按照我们的命令去执行任务，所以才会有这么多的选择器，让统帅的命令通过选择器进行不同范围的发布。
上一篇： 简单的讲述bootstrap栅格原理
下一篇： 类与id选择器的区别
关键词:
