CSS入门05

• 浮动布局
  • 标准文档流 浏览器解析HTML代码的基本方式，根据标签的不同“display"来确定标签的定位
  • 元素浮动后，就会块化，浮动元素会脱离文档流
  • float 造成标签浮动
    • none 默认值 不浮动
    • left左浮动
    • right 右浮动
  • 如果有多个左浮动，排列顺序从左往右依次排开
  • 如果有多个右浮动，排列顺序从右往左依次排开
  • 浮动会引起父元素高度的坍塌（可直接为父元素添加height，但数值容易出问题，或更改子元素高度时，容易遗漏），开启BFC，清除float
    • overflow:hidden;(值不为visible)首选项，往后几种都会存在一些副作用
    • display:inline-block
    • float值不为none
  • 两栏自适应布局
    • .left float:left;
    • .right overflow:hidden;
    • 二者间的间距=width(.left)+二者显示出的间隙
  • 圆角设置
    • border-radius: n px; overflow:hidden;