我想添加正确的代码,让我的最新文章(来自while循环)在5列的部分。什么是最好的方法来做到这一点?
<div class="container">
<div class="container container--narrow page-section">
<h2 class="headline headline--small-plus t-center">Laatste nieuws</h2>
<?php
$homepagePosts = new WP_Query(array(
'posts_per_page' => 5,
'category_name' => 'Posts'
));
while ($homepagePosts->have_posts()) {
$homepagePosts->the_post(); ?>
<div class="event-summary">
<a class="event-summary__date event-summary__date--beige t-center" href="#">
<span class="event-summary__month"><?php the_time('M'); ?></span>
<span class="event-summary__day"><?php the_time('d'); ?></span>
</a>
<div class="event-summary__content">
<h5 class="event-summary__title headline headline--tiny"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h5>
<p><?php echo wp_trim_words(get_the_content(), 18); ?><a href="<?php the_permalink(); ?>" class="nu gray">Lees meer</a></p>
</div>
</div>
<?php } wp_reset_postdata();
?>
我试图做一个5列的部分,但陷入了如何我可以循环它与我最近的职位。
1条答案
按热度按时间vc9ivgsu1#
您可以使用CSS网格来创建布局。每个
.event-summary
应该占用网格容器的一列。如果您想指定它们应该占用的列数,请使用grid-column: span ...;
和您希望它占用的列数。请参见下面的示例。