HTML的float与clear问题

html-css016

HTML的float与clear问题,第1张

float 属性定义元素在哪个方向浮动。

其属性有:

float:left;

float:right;

float:none;

float:inherit;

--------------------------------

left 元素向左浮动。

right 元素向右浮动。

none 默认值。元素不浮动,并会显示在其在文本中出现的位置。

inherit 规定应该从父元素继承 float 属性的值。

-------------------------------------------------------------

clear 属性定义了元素的哪边上不允许出现浮动元素。

其属性有:

left 元素向左浮动。

right 元素向右浮动。

none 默认值。元素不浮动,并会显示在其在文本中出现的位置。

inherit 规定应该从父元素继承 float 属性的值。

float是固定位置的浮动(保留其尺寸大小所占的空间),与页面中浮动(absolute)不一样(脱离同级内容,独立漂浮在页面中)。

首字母下沉可以使用:first-letter伪类实现,也可以使用你现在的方法。

实现两个DIV盒子并排,一行只显示两列DIV布局,使用width宽度+float浮动即可实现一行显示两列DIV布局。

解决方法:一个设置为float:left,一个设置为float:right。

1、完整HTML源代码:

2、两列并排DIV实例截图: