CSS——脱离标准流方法一：浮动

浮动是css里面布局用的最多的属性。

浮动语句：

float:left;  左浮动

float:right;  右浮动

1、没有浮动的时候

2、两个盒子都左浮动

浮动的元素脱标，那么就能并排了，并且能够设置宽高了。一个span标签如果浮动，不需要转成块级元素，就能设置宽度、高度。浮动的所有标签已经不区分行内、块了。

浮动的元素互相贴靠。

3、两个盒子都右浮动

4、浮动的元素有“字围”效果

<div>盒子1</div>
<p>12345文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字</p>

div左浮动，p不浮动，div挡住了p，但是p中文字不会被挡住，形成“字围”效果。

浮动的性质：脱标、贴边、字围、收缩。

收缩：一个浮动的元素，如果没有设置width，那么将自动收缩为文字的宽度（这点非常像行内元素）。

最后

以上就是欣喜硬币为你收集整理的CSS——脱离标准流方法一：浮动的全部内容，希望文章能够帮你解决CSS——脱离标准流方法一：浮动所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。