Skip to content

CSS 浮动样式

当元素被浮动时,会脱离文档流,根据 float 的值向左或者向右移动,直到它的外边界碰到父元素的内边界或另外一个浮动元素的外边界为止,是 CSS 布局中实现左右布局的一种方式

  • 文档流:文档流是元素在 web 页面上的一种呈现方式,按照出现的先后顺序进行排列

清除浮动的方案

  • clear 属性
  • BFC(后面再说)
  • 空标签
  • .clearfix::after{}

浮动特性注意点

  • 只会影响后面的元素
  • 文本不会被浮动元素覆盖
  • 具备内联盒子特性:宽度由内容决定
  • 具备块级盒子特性:支持所有样式
  • 浮动放不下,会自动换行

基于 MIT 许可发布