网页布局基础(2)-横向俩列布局

1、float属性

3个属性:left(左浮动) /  right(右浮动) /  none(不浮动)html

特色:元素会左 / 右移,直至触碰容器为止。布局

url

就像容器边缘有磁铁吸引spa

*注意:设置了浮动的元素,依旧处于标准文档流中。htm

2、清除浮动影响的方法

     当元素设置浮动属性后,会对相邻的元素产生影响​。(相邻元素特指紧邻后面的元素)blog

1.clear属性:clear : both  (clear : left 或者 clear : float)
​​​                  ​​​​//   不清楚的状况下使用clear : both文档

2.同时设置width : 100% (或者固定宽度)+overflow : hidden ;get

                 //​    紧邻元素使用方法1   ;  父级元素受影响使用方法2容器

3、横向俩列布局

方法:1.float属性 - 使纵向排列的块级元素,横向排列;float

          2.margin属性 - 设置俩列之间的布局。



清除属性的注意点在不一样状况下使用不一样清除浮动的方法。

相关文章
相关标签/搜索