标签：
经过第一天的练习后完成的页面的快速导航、顶部广告、搜索栏今天将继续完成下面的页面。
在一般的情况下页面是从左到右，从上到下依次进行布局的。可是由于可以将通用的样式封装以便于后面的使用所以今天我们完成页面的最下面部分。
在布局的时候，相邻的行内块元素之间默认有几像素的外间距。只能用浮动来解决这个问题。
这是CSS3的一个新属性，其作用是向元素添加圆角边框。他一共有四个值：左上 左下 右上 右下。四个值为元素宽度或是高度的一半的时候，会将元素变成圆形或是椭圆形，峰值只能到达宽度或是高度的一半。
由于子盒子设置了浮动脱离了标准流而造成了父盒子的高度塌陷这就是浮动造成的影响。而清除浮动并不是真正意义上的把所有的浮动都清除掉，而是把浮动所带来影响全部清除掉。(详细的可以在w3c上面查询)下面列举了清除浮动的四中方法：
① 给父盒子设置一个高度，其原理是用高度撑出子盒子浮动后失去的高度。
② 给父盒子设置overfflow：hidden属性，其原理是触发了BFC模式（BfC所牵扯知识太多请自行百度）。
③ 在所有的元素后添加一个div为这个div设置clear：both属性，其原理是 运用clear属性隔断所有的浮动。
④ 运用伪元素的方式，写一个clearfix类并为其写一个：after的伪元素，其原理与上相同也是运用了clear属性隔断所有的浮动。
定位(相对和绝对或固定)的元素都有一个层级的属性或是概念。如果定位了的相邻多个元素，在同一个位置的话，后面的元素默认会压住前面的元素。如果同样是定位了的元素，默认他们的层级都是0，只不过后面的元素会压住前面的元素。如果想让当前的元素显示在后面的元素之上，这个时候就需要改变层级的关系,用z-index来改变。
① 列表：列表分为三种分别是有序列表(<ol>)、无序列表(<ul>)、自定义列表(<dl>)。不同的列表有不同的样式
② background的符合属性内容：
background-color: 背景颜色 background-img: url() 链接 的图片
background-repeat: 图片是否平铺 no-repeat repeat-x repeat-y
background-position: 背景图片的位置 0 0
background-attachment: 是否滚动
background: 颜色 图片的链接 是否平铺 背景位置 是否滚动。
background的属性是可以连写的并且没有顺序，也没有必写内容。
学习是个循序渐进的过程不进则退，在今天需要掌握的主要内容已经如上所列（没有基础的请参照w3c的Html，css基础）。今天的学习重点需要放在定位以及层级的概念上。
标签：
原文地址：http://www.cnblogs.com/wjwcn/p/5702073.html
