css浮动

float讲解
1、float:该属性指定一个元素应沿其容器的左侧或右侧放置,允许文本和内联元素环绕它。该元素从网页的正常流动(文档流)中移除,但是仍然保持部分的流动性(与绝对定位相反)。

2、浮动最早是用来解决文字环绕的问题。

3、在style中给标签添加float属性即可。

4、浮动,会脱离文档流------不再保留原来位置,会造成在其下方的兄弟元素位置发生变化。

5、当子元素发生浮动时,其父元素的高度发生塌陷。

float    ---可以左浮动,也可以右浮动
float: left;   ---向左浮动
float: right;   ---向右浮动



float问题解决办法
clear:该属性指定一个元素是否必须移动 (清除浮动后) 到在它之前的浮动元素下面。clear 属性适用于浮动和非浮动元素。

添加clear属性------清除浮动
clear: both;



当应用于非浮动块时,它将非浮动块的边框边界移动到所有相关浮动元素外边界的下方。这个非浮动块的顶部外边距会折叠。

另一方面,两个浮动元素的垂直外边距将不会折叠。当应用于浮动元素时,它将底部元素的外边界边缘移动到所有相关的浮动元素外边界边缘的下方。这会影响后面浮动元素的布局,因为后面的浮动元素的位置无法高于它之前的元素。
 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值