Question

在处理项目时，我发现Tumblr上的一些图像没有显示。我发现的唯一线索是在响应级别1级（请参阅下面的html代码）中，iFrame的高度设置为0.如果我在Chrome中打开一个开发控制台并将其设置为，例如，1632（不是0），图像出现。我正在使用主题（砖主题/主题花园），但我能够编辑html和CSS。我可以修改我的CSS和/或HTML来解决这个问题吗？问题出现在设备平台（桌面/手机/平板电脑）上。

无图像显示示例 - http://deligrossery.com/post/149661412746/gawad-deli-grocery-207-hart-st-brooklyn-ny

相应的css文件： responsive.css：http://static.tumblr.com/eftyn9y/kc0og8vio/responsive.css style.css：static.tumblr.com/3zmswwt/Fmkmwgp8e/style.css （^我不能发布超过2个链接，直到我的声誉至少为10 /向style.css添加https：//）。

<iframe id="photoset_iframe_149661412746" class="photoset" scrolling="no" frameborder="0" height="0" width="500" style="border:0px; background-color:transparent; overflow:hidden;" src="http://deligrossery.com/post/149661412746/photoset_iframe/deligrossery/tumblr_ocn1e9dTfK1txl3g8/500/false" name="photoset_iframe_149661412746"></iframe>

Answer 1

尝试将photoset布局块更改为此类内容（您可能需要略微调整一下）：

{block:Photoset}
    <div class="content photoset">
        {block:Photos}
           <img src="{PhotoURL-500}"/>
        {/block:Photos}
        {block:Caption}
           <div class="description">{Caption}</div>
        {/block:Caption}
           <p><a href="{Permalink}" class="link"></a></p>
    </div>
{/block:Photoset}

保留当前主题的备份。

这应该在普通的html模板（而不是iframe）中输出photoset。从那里开始控制内容的高度要容易得多，实际上默认情况下它应该只输出内容，高度将自动固定。但在此之后可能还有其他问题需要调查。

响应类将iFrame高度设置为0，导致无图像显示

1 个答案: