V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
toctan
V2EX  ›  问与答

background-image 图片加载成功,为什么不显示? Chrome Bug?

  •  
  •   toctan · 2013-12-04 13:29:58 +08:00 · 7419 次点击
    这是一个创建于 3768 天前的主题,其中的信息可能已经有所发展或是发生改变。


    如图,Chrome Version 31.0.1650.57
    Safari 正常,另外一台 Ubuntu Chrome 28 也能正常显示。
    第 1 条附言  ·  2013-12-05 11:08:36 +08:00
    目测和 Rails 4 的 Turbolinks 有关,我把浏览器的 JavaScript 禁用,或者通过网址直接访问这个页面,或者刷新图片都能够正常显示。问题是,在 Safari 和其它版本上的 Chrome 都没这个问题...
    5 条回复    1970-01-01 08:00:00 +08:00
    yushiro
        1
    yushiro  
       2013-12-04 13:43:31 +08:00
    试试给div指定宽高, 宽高就等于背景图的宽高。
    JoyNeop
        2
    JoyNeop  
       2013-12-04 20:16:03 +08:00
    同楼上,指定款高

    //P.S. 不要用 style 属性啊……要放进 style 标签或者 link 或 @import 进来啊……
    toctan
        3
    toctan  
    OP
       2013-12-05 10:05:43 +08:00
    @yushiro
    @JoyNeop

    这个之所以用 inline style 是因为每个 node 都有自己的背景图片,是从数据库取出来的。而且我不可能指定宽高,第一,这会破坏 fluid layout,第二,这图片用户上传我不知道宽高。
    yushiro
        4
    yushiro  
       2013-12-05 10:39:29 +08:00
    那就不能用div的背景图来实现你的效果, 因为背景图不会撑开DIV(至少chrome下如此,解决办法未找到,如果你找到什么方法,请回复一下)
    还有, 既然你都已经图片从数据库取出了, 多带一个宽高信息吧, 这个很有用, 以后显示瀑布流很方便。
    toctan
        5
    toctan  
    OP
       2013-12-05 11:06:01 +08:00
    @yushiro 我知道背景图不会撑开 div, 这个 div 的宽高不会通过图片来确定,其长宽比是确定的(golden ratio),通过 padding 来控制。这本来就是一个背景图,不应该用 img tag 作为 content 出现。

    另外,这样做是没有问题的。看这里: https://medium.com/collections
    我估计是因为我用了 Rails 4 的 Turbolinks, 刚好在这一个 Chrome 版本有点问题。因为前段时间在 Ubuntu, Arch Linux 上开发都没有问题,这两天换了 Mac, 在 Chrome 里才出现这问题的,Safari 也正常。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2839 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 13:19 · PVG 21:19 · LAX 06:19 · JFK 09:19
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.