首页 > 代码库 > 关于浮动和内联元素的使用

关于浮动和内联元素的使用

(1)对于同一级的两个<div>块,如果我们要使几个<div>块可以在同一个水平线上排开,则这几个同一级的<div>块要同时设置浮动float:left或者同时设置内联元素display:inline-block;(如果同一级的<div>块只有有一些设置了浮动一些没有设置浮动那么这些<div>块很有可能会相互叠在一起);

   1.1同一级的<div>块同时设置浮动float:left或者同时设置内联元素display:inline-block这两者的区别在于:

       同一级的<div>块同时设置浮动float:left时各个<div>块之间的间隙大于同时设置内联元素display:inline-block时各个<div>块之间的间隙;

   1.2如果要清除浮动我们要使用clear:both/left/right;

(1)对于已经设置了浮动的<div>块的父级<div>块,如果父级<div>块没有同样的设置浮动,则很有可能父级<div>块会被挤出来,所以在这种情况下如果要保证两个<div>块之间的相互位置关系不变我们应该设置父级<div>块元素的高度

关于浮动和内联元素的使用