元素 float:right 后右对齐换行原因

林继 VPS 知识 2,172 共写了238个字 (2012-02-17 13:09:59) 没有评论 打印 扫描二维码 百度已收录
  1. <p style="width: 400px; height: 20px; text-align: left;">新闻新闻新闻<span style="float: right">2007-08-18</span><span style="clear: both;"></span></p>  
  2.  
  3. <p style="width: 400px; height: 20px; text-align: left;"><span style="float: right">2007-08-18</span>新闻新闻新闻</p>

效果:


原因:

当非float的元素和float的元素在一起的时候,如果非float元素在先,那么float的元素将被排斥
也就是说,你的span是float:right,但是你文本还是float:none

如果要让两者占据同一行:

要么你把span先于文本显示 :2007-08-18 (示例第3行)
要么把文本也设成float:新闻新闻新闻
参考: http://www.zvv.cn/blog/?action=show&id=31

如果觉得我的文章对您有用,请随意赞赏。您的支持将鼓励我继续创作!

发表评论

电子邮件地址不会被公开。 必填项已用*标注

< >