CSS定位的四种常用方法

CSS定位有四种常用方法：静态定位、绝对定位、相对定位和浮动定位。

静态定位

静态定位是默认的定位方式，元素按照正常文档流的顺序排列，不能对元素进行定位，只能改变元素的文本对齐、行高、字间距等属性，使用方法如下：

.box {
    position: static;
}

绝对定位

绝对定位是把元素从文档流中拖出，相对于最近的已定位祖先元素进行绝对定位，使用方法如下：

.box {
    position: absolute;
    top: 10px;
    left: 10px;
}

相对定位

相对定位是相对于元素本身位置进行定位，元素仍然保留在文档流中，使用方法如下：

.box {
    position: relative;
    top: 10px;
    left: 10px;
}

浮动定位

浮动定位是把元素从文档流中拖出，使用float属性，让元素向左或向右移动，使用方法如下：

.box {
    float: left;
}