浮动及其特性，怎样清除浮动

浮动

• float

  • right

  • none

  • left

浮动特性

• 1、使元素脱离文档流

• 2、提升层级半级

• 3、使不支持宽高的元素重新支持宽高

• 4、如果没有设置宽度，浮动元素的内容去撑开宽度

• 5、浮动元素什么时候停止

  • 遇到父级元素的边框的时候停止

  • 遇到相同的浮动元素的时候会停止

清除浮动

• 1、给父级元素设置高度

  • 拓展性差

• 2、给父级元素设置浮动

• 3、overflow:hidden;

• 4、display:inline-block;

• 5、clear

  • left

  • right

  • both

  • none

• 6、

  • :after

  • content:”“;

  • clear:both

  • display:block;