欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

css float 属性解析_html/css_WEB-ITnose

程序员文章站 2022-05-30 16:01:58
...
float 属性的定义:使元素在哪个方向浮动

默认值为:none

注意:浮动元素会生成一个块级框,而不论它本身是何种元素

HTML代码:

     
框1
框2
框3
框4

1,当兄弟元素全为浮动元素时其父类元素在没有自定义宽高时其高度将为零

css样式:

.main {      border: 1px solid ;   } .d {      border: 1px solid red;      width: 50px;      height: 50px;      float: left;   }

显示效果:

2,浮动元素会在一行之内空间不够多余的浮动元素会跳至下一行

css样式:

 .main {      border: 1px solid ;      width:130px;   } .d {      border: 1px solid red;      width: 50px;      height: 50px;      float: left;   }

显示效果:

3,浮动元素会脱离文本流,其参照父类元素

ccs样式:

  #d1{     float:left;   }

显示: