浮动的一些应用解析

样式如下:

.parent{ width:92px; height:92px; border:1px solid #666;}
 .parent p{ float:left; width:30px;}

.parent p+p{ float:right;}

HTML内容如下:

<div class="parent">
  <p>a</p>
  <p>b</p>
  <p>c</p>
 </div>

显示排列结果: acb

样式分析:p+p相邻选择符首先会将第一个起作用的p元素(即b)浮动到右边,然后对第二个p元素(即c)起作用,此时c先会浮动到右侧,但右侧已经存在内容b了,所以c会仅挨着b,在b的左侧排列,最终结果为:acb

猜你喜欢

转载自kstgjfk403.iteye.com/blog/2300984