使用最后一个孩子在循环中设置最后一个帖子的样式 [英] Using last-child to style last post in a loop

问题描述

我正在使用border-bottom在搜索结果中的帖子之间添加一行，但这在页面底部留下了额外的一行.我试图在样式表中使用 last-child 删除多余的行.不过，添加 last-child 会删除循环中的所有行.这是我所拥有的:

I'm using border-bottom to add a line between posts in search results, but that leaves an extra line at the bottom of the page. I'm trying to use last-child in my style sheet to remove that extra line. Adding last-child removes all the lines in the loop though. Here's what I have:

.results {
    overflow: hidden;
    border-bottom: 1px dashed #666; 
    padding-bottom: 15px;
}

.results:last-child {
    border-bottom: 0;
}

这是我的content-search.php中的HTML:

Here's the HTML from my content-search.php:

<div class="results-container">
    <div class="results">
        <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
            <header class="entry-header">
                <?php the_title( sprintf( '<h1 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h1>' ); ?>
            </header><!-- .entry-header -->
                <span class="preview-artwork-info">Content...</span>
        </article><!-- #post-## -->
    </div><!-- .results -->
</div><!-- .results-container -->

推荐答案

我遇到了类似的挑战，我在每个帖子/通知之间添加< hr> 标记以分隔它们.我尝试使用"last-child"选择器，但它删除了所有分隔符.因此，我改为使用"forloop.last"像这样的方法:

I was facing a similar challenge where I was adding <hr> tag between every post/notification for separating them. I tried using "last-child" selector but it was removing all the separators. So instead I used "forloop.last" method like this:

 {% for n in notifications %}
     {{n}}
     {% if forloop.last %}{% else %}<hr>{% endif %}
{% endfor %}

这很好.希望这会有所帮助！

This works fine. Hope this helps!!

这篇关于使用最后一个孩子在循环中设置最后一个帖子的样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！