Html布局

积累,以少成多

布局在任何一款软件中都是具有的，在html中也是不可缺少的。html中的布局分为：相对布局，绝对布局，浮动。

1、static

static是默认的布局方式。不可以用left，right，top，bottom。但是可以用margin-left、right、top、bottom。一般请款下left和right只用一个，top和bottom只用一个。

2、relative(相对布局)

relative相对布局，它是在它原本位置的基础上进行偏移，也就是说它相对的对象是它自己本身，但是它依然占据原本的位置。可以通过left、right、top、bottom等进行控制。

3、absolute(绝对布局)

absolute是绝对布局，参展位置是离当前元素最近的定位方式为fixed,absolute,relative的祖先元素的左上角。但是该元素不占用原本的位置。可以通过left、right、top、bottom等进行控制。

4、fixed(固定定位)

fixed是固定定位，跟absolute差不多，但是有区别。参照位置是浏览器窗口的左上角，即坐标点为(0px, 0px)。它的参照位置是固定的。它也不占有原本的位置。可以通过left、right、top、bottom等进行控制。

5、float(浮动)

float浮动，故名思议该元素会浮动起来，不占用原本的位置。可以设置float为left、right等。

总结：

熟练的掌握布局，对制作网页是非常重要的。