V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Can I use?
http://caniuse.com/
Less
http://lesscss.org
Cool Libraries
Bootstrap from Twitter
Jetstrap
ivito
V2EX  ›  CSS

为什么 img 设置 float 后不会覆盖

  •  
  •   ivito ·
    fireboyvt · 2015-07-08 10:11:49 +08:00 · 3937 次点击
    这是一个创建于 3426 天前的主题,其中的信息可能已经有所发展或是发生改变。
    <html>
    <head>
    <style type="text/css">
    .pf
    {
    float:left;
    }
    </style>
    </head>

    <body>
    <div>
    <img src="eg_smile.gif" />
    <img class="pf" src="eg_smile.gif" />
    </div>
    </body>
    </html>

    问题是为什么第二个img不会覆盖在第一个上边呢,而是两个在一行并排着。
    6 条回复    2015-07-08 11:50:21 +08:00
    morethansean
        1
    morethansean  
       2015-07-08 10:43:32 +08:00
    ……谁告诉你 float 是覆盖的意思
    jjplay
        2
    jjplay  
       2015-07-08 10:52:35 +08:00
    你对行,块,浮动元素 的概念还不太清晰,想覆盖 现在用相对 绝对定位吧,妥妥的,理解的问题慢慢来
    ivito
        3
    ivito  
    OP
       2015-07-08 11:38:43 +08:00
    @morethansean @jjplay 对行还不太了解,如果是块浮动的话就会覆盖了吧
    br00k
        4
    br00k  
       2015-07-08 11:41:15 +08:00
    因为img是inline-block
    66beta
        5
    66beta  
       2015-07-08 11:41:59 +08:00
    换 position
    jankan
        6
    jankan  
       2015-07-08 11:50:21 +08:00
    float后的元素是优先排列,类似inline-block,其他不float的元素会占满这行后换行
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2713 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 00:06 · PVG 08:06 · LAX 16:06 · JFK 19:06
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.