使用循环显示具有不同HTML标记的3个帖子

我想能够在我的索引上显示来自同一类别的3篇文章。php页面，但由于我的网站HTML/CSS的编码方式，我很难理解使用循环来实现这一点的正确方法（因为三个部分使用的div代码不同，它使用不同的CSS样式来实现分层效果/外观）。

下面是HTML代码

<div id="first-story" class="story">
<div class="content">
<h3 class="story-heading">Headline 1</h3>
<ul>
   <li>Nullam sit amet scelerisque est. </li>   
   <li>Aliquam erat volutpat. Duis sed nisi nunc, faucibus rutrum mauris. </li>
   <li>Nullam iaculis lorem ut tortor ullamco per aliquet. Integer id leo non mauris pulvinar gravida vitae a enim. </li>
   <li>Nullam sit amet scelerisque est.</li>
</ul>   
    <a class="learnmore" href="#"><img src="img/button-learnmore.png"></a></div>
<div class="edge"></div>

<div id="second-story" class="story">
<div class="content">
 <h3 class="story-heading">Headline 2</h3>
   <p>Paragraph text</p>
   <a class="learnmore" href="#"><img src="img/button-learnmore.png"></a></div>
</div>

<div id="third-story" class="story">
<div class="edge"></div>
<div class="content">Headline 3</div>
        <ul>
           <li>List item</li>
        </ul>
        <a class="learnmore" href="#"><img src="img/button-learnmore.png"></a></div>
</div>

任何帮助都将不胜感激。

while( have_posts() ): the_post(); if( 0 == $wp_query->current_post ) { echo \'this is the first post\'; // markup for first post } elseif( 1 == $wp_query->current_post ) { echo \'this is the second post\'; } elseif( 2 == $wp_query->current_post ) { echo \'this is the third post\'; } else { echo \'this is > third post\'; } endwhile;

$args = array(); // your custom query args $custom_query = new WP_Query( $args ); while( $custom_query->have_posts() ): $custom_query->the_post(); if( 0 == $custom_query->current_post ) { echo \'this is the first post\'; } // etc.. endwhile;

小码农CODE

相关推荐

Dropdown Menu for Query_Posts