如何在我的 tumblr 自定义主题中获取大图像？答案

【问题标题】：How do I get large images in my tumblr custom theme?如何在我的 tumblr 自定义主题中获取大图像？
【发布时间】：2012-02-08 20:39:27
【问题描述】：

在 Tumblr 中，the maximum image size is 500px。我想知道如何在我的自定义主题中获得更大的图像。

【问题讨论】：

标签： html css tumblr

【解决方案1】：

唯一的复杂性是包含一个后备，因此如果不存在高分辨率图像，则使用标准尺寸的图像。 注意：这些说明适用于使用 Tumblr 的主题语言创建自定义主题。还值得注意的是，这必须在照片块内{block:Photo} {/block:Photo}

此方法取决于 Tumblr 的 {block:HighRes}。使用{block:HighRes}{/block:HighRes} 包裹的代码仅在存在高分辨率版本的图像时才存在。

首先，隐藏普通图片。

<img src="{PhotoURL-500}" {block:HighRes}style="display:none"{/block:HighRes} />

第二，用自定义类显示大图。

{block:HighRes}
    <img src="{PhotoURL-HighRes}" class="highres">
{/block:HighRes}

注意：该类是必需的，因为您可能需要设置最大图像宽度。如果您不想乱用自定义 CSS，通常可以在 img 标签中使用 style="max-width:100%"。

【讨论】：

【解决方案2】：

您可以使用 {PhotoURL-HighRes} - 它还带有一个块来检测是否上传了高分辨率照片。 Docs and details can be found here :)

此外，您可能希望区分上传高分辨率照片的时间和未上传的照片。使用这样的块，您可以让 tumblr 显示高分辨率图片（如果有），如果没有，则默认为 500px 版本。

{block:IfContentWidth500}
    <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
{/block:IfContentWidth500}

{block:IfNotContentWidth500}
    <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
{/block:IfNotContentWidth500}

请注意，高分辨率照片将以上传时的尺寸呈现。为了保持它们的行为，在您的样式中将 max-width 属性添加到您的图像元素或容器会有所帮助。

另外，你需要enable hi-res photos from your theme options

希望这会有所帮助！

【讨论】：

谢谢，让这个来回答自己，没想到我要等 7 个小时... :S
它说您在不到半小时前添加了此内容...但欢迎您！
我是想自己回答的；）
当然可以。我试图成为一个语义互联网公民，并通过链接在这里回答这个问题。
块 {block:IfNotContentWidth500} 和 {block:IfContentWidth500} 不适合我。错误可能在哪里？