学习编程的第十二天

块元素在文档流 会独占一行，自上而下排列
如果设置元素浮动，元素脱离文档流后，就不会具有在文档流中的特点
float: ; 设置元素的浮动
可选值：
none 默认值，元素正常显示，不浮动
left 元素向左浮动
right 元素向右浮动
float可以使块元素水平布局

  设置float浮动特点（第一类特点）
    1、设置元素浮动之后，元素会脱离文档流，元素原来在文档流中的位置，就不会存在
      下面的元素就会上移，挤上去
    2、设置元素浮动之后，元素会尽量的向左或者向右，向上进行移动，
    而且默认情况下，不会脱离父元素的范围
    3、设置浮动的元素，不会超过它前一个兄弟，最多一遍齐
    4、如果浮动元素的前一个兄弟，没有浮动，则浮动的元素不会超过他前面没有浮动的元素

    总结：浮动主要是用于元素的水平布局
    浮动的第二类特点
  当浮动元素遇到了文字，浮动的元素不会覆盖文字，而是文字会环绕在浮动元素的周围
  从而实现文字环绕图片的效果
  这也是浮动最早的功能，只是后面用于水平布局
  浮动的第三类特点
  元素在文档流当中
  块元素  ： 独占一行
  行内元素 ： 不会独占一行，不能自定义设置宽高
  行内块元素 ：兼具块元素，行内元素的特点

  元素脱离文档流了，就不再区分块，行内，行内块，也就不具有以上的特点
    元素也不会独占一行了，也可以设置宽高了等等
    当元素设置浮动以后，会完全脱离文档流，元素的一些特点也会发生改变
	  脱离文档流的特点
		块元素：
			1:块元素不再独占页面的一行
			2:块元素的宽高被内容撑开
		行内元素：
			1:浮动过后的行内元素更像行内块元素,因问一行可以显示多个，并且默认宽度为内容的宽度
		
	 总结：当元素设置浮动以后,脱离文档流，就不需要再区分块和行内