html中盒子的定位,css盒子的定位有哪些方法？

所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。

什么是盒子定位呢，顾名思义，就是元素盒子(以下主要以块级盒讲解)在页面中的位置，定位就是确定他的位置，盒子定位分为以下四种 ：推荐：css手册

1、静态位置(position：static)也就是默认值：

每一个元素在没有float值的时候，都有position值，就是static，可以直接理解它在是默认值的时候就是常规流，所有规则与常规流一样；

2、相对位置(position：relative)：

相对定位：相对于自己原来的位置进行移动。

实际代码操作：对于标签样式先声明position:relative;

再描述移动方向与像素大小

left带正数向右移，以此类推，正数情况下方向相反，那么在这种情况下对于初学的我们，这种定位可以以带负数形式就与标签头方向相同了。

以相对定位移动盒子后盒子时不脱离标准流的，所移动的是一个“虚影”，并非整个盒子往那边移动，所以盒子移动之后，周围的盒子是不会发生变化的。

相对定位在实战中用得比较少，一般用于盒子微调。

3、固定位置(position：fixed)：

固定定位，顾名思义就是固定盒子不随网页滑动而移动

实际代码：position:fixed;

可以通过top、bottom、left、right设置像素值来固定位置；

一般用于导航栏或者网页角落的广告；

4、绝对位置(position：absolute)：

绝对定位使元素的位置与文档流无关，也就是脱离文档流，因此不占据空间，比如说有三个纵向排列的三个元素盒子，尺寸宽高都为100px。

如果给中间的盒子设置了position：absolute；那么他就会脱离出来，它下面的那个盒子就会向上浮，绝对定位盒子的包含块主要看他父级或祖先级里面有没有定义了position值的，如果有，就是他的包含块。

这一点与相对定位不同，相对定位实际上被看作普通流定位模型的一部分，因为元素的位置相对于它在普通流中的位置。