0

我正在为我的主题开发一个自定义页面（我使用的是 Foundation 4）来显示特定类别的帖子。我正在尝试将摘录放入框中（使用 4 列类），该框也显示帖子的缩略图。

问题是这些框在彼此下方排列（请参阅打印屏幕的链接）：

http://goo.gl/Kj4uwC

这是代码：

<?php get_header(); ?>
<div class="row">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php the_content(''); ?>

<?php endwhile; ?>

<?php query_posts('cat=12'); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="row" >
<div class="large-12 columns" >
<div class="large-4 columns panel" style="float:left">
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail');?> </a>
<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
<?php the_excerpt(); ?>
<p class="button radius radius small"><a href="<?php the_permalink(); ?>">Ler matéria</a></p>
</div>
</div>
</div>
<?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_query();?>
<?php endif; ?>   
</div
<?php get_footer(); ?>

如果有人可以帮助解决这个问题，我会很高兴！非常感谢！！！

4

1 回答 1

0

使用<div class="row">时会跳到下一行。如果您想在同一行中有三个项目（并且您的项目总共只有 3 个），那么您可以将输出设置为：

<div class="row">
<!-- Start loop -->
  <div class="large-4 columns">

  </div>
<!-- End loop which would have created 3 * the large-4 columns divs -->
</div>

如果您希望每行 3 个项目并且可以通过循环踢出任意数量的项目，那么最好使用块网格。它将被设置为：

<div class="row">
  <div class="large-12 columns">
    <ul class="large-block-grid-3>
    <!-- Start loop -->
      <li><li>
    <!-- End loop which will create however many li that you need, and place them 3 per row -->
</div>
于 2013-08-16T03:47:09.783 回答