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

怎样针对图片引入不同的class?

  •  
  •   joynic · 2012-02-29 14:29:32 +08:00 · 3488 次点击
    这是一个创建于 4446 天前的主题,其中的信息可能已经有所发展或是发生改变。
    使用wordpress,想实现首页以图片墙的形式展示文章。每篇文章仅显示一张缩略图。三张图片为一行(即三篇文章)。请问怎样针对这三张图片引入不同的class?

    比如:

    <li id="post-<?php the_ID(); ?>" class="group">图片A</li>
    <li id="post-<?php the_ID(); ?>" class="group">图片B</li>
    <li id="post-<?php the_ID(); ?>" class="group third">图片C</li>

    问题很菜。
    8 条回复    1970-01-01 08:00:00 +08:00
    joynic
        1
    joynic  
    OP
       2012-02-29 21:12:04 +08:00
    ^_^有人能帮忙一下吗?
    sobigfish
        2
    sobigfish  
       2012-02-29 21:27:09 +08:00
    id索引index index%3
    icyflash
        3
    icyflash  
       2012-02-29 21:32:23 +08:00
    你这样做是为了解决什么问题呢?

    如果是要每行的最后一个添加一个固定的class的话,添加一个变量i,i/3==0?' third':''
    joynic
        4
    joynic  
    OP
       2012-02-29 21:52:26 +08:00
    @icyflash
    恩,就是实现每行的最后那张图的class多增加一个third

    效果参考http://dribbble.com/

    SORRY,我也没说清楚。

    具体应该怎么写呢?谢谢^_^
    icyflash
        5
    icyflash  
       2012-02-29 22:21:20 +08:00
    <?php
    if ( have_posts() ):
    $i=0;
    while ( have_posts() ) :the_post();
    $i++; ?>
    <li id="post-<?php the_ID(); ?>" class="group <?php echo($i/3==0?' third':'') ?>">图片A</li>
    <?php endwhile; // end of the loop. ?>
    <?php endif; ?>
    php和WP我都不熟悉,你自己在试试
    sobigfish
        6
    sobigfish  
       2012-02-29 22:23:19 +08:00
    @icyflash 从3楼 我就想说。大哥取余是 %
    icyflash
        7
    icyflash  
       2012-02-29 22:42:39 +08:00
    @sobigfish 呃,我弄错了
    joynic
        8
    joynic  
    OP
       2012-02-29 22:57:23 +08:00
    @sobigfish @icyflash 谢谢两位,搞定了^_^
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2123 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 04:57 · PVG 12:57 · LAX 21:57 · JFK 00:57
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.