在CSS 中，用 float 和 position 的区别是什么

Question

如题所述

Answer 1

在CSS里float是浮动的意思，position是定位的意思。

float:浮动，故名思议，就是让HTML元素(标签)从标准文档流里浮动起来。从而不受标准文档流的约束，变成了非标准流。

标准文档流：HTML的默认布局方式，即元素从上往下，从左往右布局的。
非标准文档流：即加了float就是非标准流，它的布局方式不按标准流的布局。说穿了 就是 脱离了文档流。至于往那浮，就看你的float的值，例如float:left; 就是往左浮动.

position:定位，主要分为绝对定位和相对定位。

从某种意义上来说，float是和position同时配合使用 的，即position不是单独存在的。因为绝对定位被浮动的标签会让出它自个的所占用的位置。而相对定位则不会。

Answer 2

float： 是漂浮的意思，一般跟宽度百分比，或者固定的宽度来搭配使用，但是其缺点在于改变浏览器的形状后容易出现换行，或者整体结构的变形。

postion：是定位系统，分为几个属性：

absolute
生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

fixed
生成绝对定位的元素，相对于浏览器窗口进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

relative
生成相对定位的元素，相对于其正常位置进行定位。
因此，"left:20" 会向元素的 LEFT 位置添加 20 像素。

static 默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。
inherit 规定应该从父元素继承 position 属性的值。

这几个相对和绝对定位如果应用熟练客户很好的定位网页元素；

Answer 3

这2个应该没有什么混淆的地方吧？position: 指元素定位类型.float:指元素浮动。通常在块级元素里 使用这个。下面这个是官方的：float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。

Answer 4

float 属性定义元素在哪个方向浮动，向左向右还是居中；
position 属性规定元素的定位类型，是相对位置还是绝对位置之类

Answer 5

　　float 属性定义元素在哪个方向浮动，向左向右还是居中；