javascript - 仅使用 post 标签进行 css 更改

Question

我正在制作一个 Tumblr 主题。

仅当图像帖子具有特定标签（例如“大”或“双”）时，是否有任何方法可以将图像的宽度从 25% 更改为 50%？

这就是我所拥有的：

CSS：

   .post {
        width:25%
   }

   .big {
       width:50%
   }

的HTML：

   {block:Posts}

          {block:Photo}

                 <div class="post {block:HasTags}{block:ifTaggedBig}big{/block:ifTaggedBig}{/block:HasTags}"> 
                      <img src="..." /> 
                 </div>

           {/block:Photo}

     {/block:Posts}

Answer 1

使用帖子标签更改布局

首先，我们需要修改主题标记，添加一个名为：{TagsAsClasses}

{block:Posts}
    {block:Photo}
    <div class="post {TagsAsClasses}"> 
        <img src="..." /> 
    </div>
    {/block:Photo}
{/block:Posts}

然后使用以下 CSS：

.post img {
    width:25%
}
.big img {
    width:50%
}

最后将您的帖子标记为big. 这将导致生成以下标记：

<div class="post big"> 
    <img src="..." />
</div>

参考：发布变量 http://www.tumblr.com/docs/en/custom_themes#posts

Answer 2

假设您可以使用标签找到帖子/图像（如果没有，您需要提供有关如何存储数据的更多信息），请尝试此响应