码迷,mamicode.com
首页 > Web开发 > 详细

WEB前端 浮动

时间:2019-11-16 23:29:54      阅读:150      评论:0      收藏:0      [点我收藏+]

标签:影响   包含   size   图片   play   其它   ali   水平   它的   

简介

浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止,脱离文档流

CSS浮动

第一个是正常在文档流里,第二个是使用浮动后,就脱离里文档流,可以向右浮动,原先的位置会释放掉,不会继续占用空间

技术图片

如果三个块级元素,只有中间一个块级元素使用浮动,下面的块级元素会继续顶上去,浮动的元素会向上走。
如果三个块级元素都使用浮动的化,会并排排列
如下图所示:

技术图片

如果内容区域太窄,无法容纳水平排列的三个浮动元素,那么其它浮动块向下移动,直到有足够的空间。如果浮动元素的高度不同,那么当它们向下移动时可能被其它浮动元素“卡住”:

技术图片

CSS浮动的使用

一般CSS浮动会配合着div使用,父元素div块级元素内,任意浮动,可以做到完好的控制,不会影响其他元素的排列组合

WEB前端 浮动

标签:影响   包含   size   图片   play   其它   ali   水平   它的   

原文地址:https://www.cnblogs.com/wuyanzu/p/11874272.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!