【问题标题】:Making css changes just with a post tag仅使用 post 标签进行 css 更改
【发布时间】:2013-11-22 15:11:09
【问题描述】:

我正在制作一个 Tumblr 主题。

只有当图片帖子具有特定标签(如“big”或“double”)时,是否有任何方法可以将图片的宽度从 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}

【问题讨论】:

  • html结构是什么?
  • 欢迎来到 SO。这是可能的,但我觉得如果你扩展它,你的问题会产生更好的结果。显示帖子等的标记。
  • 更新了标记@mikedidthis
  • @user2946744 已回答,希望对您有所帮助。

标签: javascript jquery css tumblr


【解决方案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

【讨论】:

  • 不知道“{TagAsClasses}”命令。非常感谢@mikedidthis
【解决方案2】:

假设您可以使用标签找到帖子/图片(如果没有,您需要提供有关如何存储数据的更多信息),请尝试this response

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-09-17
    • 1970-01-01
    • 2022-01-14
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多