【HTML】定位和浮动

1.文档流

- 所有的元素默认情况下都是在文档流中存在的
- 文档流是网页的最底层
- 元素在文档流中的特点：
	- 块元素
  
		1.默认宽度是父元素的全部
		2.默认高度被内容（子元素）撑开
		3.在页面中自上而下垂直排列
	- 内联元素
		1.默认高度和宽度都被内容撑开
		2.在页面中自左向右水平排列，如果一行不足以容下所有的元素
			则换到下一行继续从左向右

2.浮动

- 使用float来设置元素的浮动

- 可选值：

	none 默认值，元素不浮动，就在文档流中
	left 元素向页面的左侧浮动
	right 元素向页面的右侧浮动

- 浮动特点：

	1.元素设置浮动以后，会完全脱离文档流，并向页面的左上或右上浮动。
			直到遇到父元素的边框或其他的父元素时则停止浮动。
	2.如果浮动元素上边是一个没有浮动的块元素，元素不会超过该块元素。
	3.浮动元素的浮动位置不能超过他上边浮动的兄弟元素，最多一边齐
	4.浮动元素不会覆盖文字，文字会围绕在浮动元素的周围，所以可以通过浮动来实现文字环绕图片的效果。
	
- 浮动以后元素会完全脱离文档流，脱离文档流以后元素会具有如下特点：
	1.块元素不独占一行
	2.块元素的宽度和高度都被内容撑开
	3.元素不在文档流占用位置
	4.内联元素会变成块元素

- 高度塌陷

	- 在文档流中元素的高度默认被子元素撑开，当子元素浮动时，子元素会脱离文档流，
		此时