在选择器里
#开头的表示的id选择器
.开头的表示的是类名选择器
类名选择器的优先级要低于id选择器
但是通常我们不使用id选择器，id通常是为JS而预留的
<style>.con {
color: #39f
}
#con {
background-color: #f00
}
</style>
<div class="con">HTML5 学堂</div>
<div id="con">原创技术文章</div>
类名与标签的class属性对应
id名与标签的id属性对应
借助CSS3选择器:nth-child(2n+1)即可
<style>.list li:nth-child(2n+1) {
background: #39f
}
</style>
<ul class="list">
<li>《HTML5布局之路》</li>
<li>CSS3</li>
<li>特殊选择器</li>
<li>:nth-child()</li>
</ul>
网站缩放产生是因为页面宽度无法容纳两个元素产生布局被撑破了。如下所示方法：
<div style="width:1000pxmargin:autooverflow:hiddenclear:both">
<!----overflow 属性有必要存在,超出范围隐藏---->
<div style="width:600pxbackground:#f00float:left">分类浏览</div>
<div style="width:400pxbackground:#39Ffloat:left">编辑推荐</div>
</div>
