今天没学啥新知识，复习巩固一下之前选择器知识吧。
前两天在stackoverflow上问了一个关于选择器的问题： div#sidebar和#sidebar div的区别是什么？
热心网友的回答让我总算搞明白了。
#sidebar div：是选择id为sidebar的子孙中的div元素，注意是子孙哦！它本身的这个sidebar元素是不会被选择的。
div#sidebar：则是选择id是sidebar的所有div元素。
用下面这个例子搞明白吧：
<html>
<head>
<style type="text/css">
div#sidebar, #sidebar2 div {
background-color: red;
opacity: 50%;
}
#cool{
background-color: yellow;
}
div {
border: 2px solid blue; padding: 3px;
}
</style>
</head>
<body>
<div id="sidebar">
<div id="cool">div#sidebar
</div>
</div>
<div id="sidebar2">
<div>#sidebar div</div>
</div>
</body>
</html>
效果如下，可以看到#sidebar div只用它里面的子孙元素变红了!而div#sidebar则让id为sidebar的元素变红，因为background-color是不能继承的，所以它的子元素cool并没有变红。
