我想将我的wordpress帖子显示为2行，每行将包含2个帖子 _WordPress开发

我正在处理默认的博客主页代码。每个博客页面都有4个帖子。现在, 它们垂直显示(一个接一个, 上下)。我想将这4个帖子显示为2行, 每行将分别包含2个帖子。这是博客页面的代码。我使用普通的CSS将它们设为2列。

< div class="amplify-content w-100 align-items-stretch order-0"> < div class="content-list"> < div class="mb-4"> < strong class="text-uppercase"> Category< /strong> Graphic Design Lab< /div> < div class="columncontent"> < div class="row gutter-30 mb-4"> < div class="col-12 col-md-6"> < main role="main"> < !-- section --> < section class="bl"> < ?php if (have_posts()): while (have_posts()) : the_post(); ?> < !-- article --> < article id="post-< ?php the_ID(); ?> " < ?php post_class(); ?> > < !-- post thumbnail --> < span class="blgimg"> < ?php if ( has_post_thumbnail()) : // Check if Thumbnail exists ?> < a href="http://www.srcmini.com/< ?php the_permalink(); ?>" title="< ?php the_title(); ?> "> < ?php the_post_thumbnail(); // Fullsize image for the single post ?> < /a> < ?php endif; ?> < /span> < !-- /post thumbnail --> < !-- post details --> < br/> < span class="date"> < ?php the_time('F j, Y'); ?> < ?php the_time('g:i a'); ?> < /span> < !-- /post details --> < !-- post title --> < h2 style="font-family: Journal-Regular; color: #d20a1e !important; text-transform: uppercase!important; " class="blgg"> < a href="http://www.srcmini.com/< ?php the_permalink(); ?>" title="< ?php the_title(); ?> "> < ?php the_title(); ?> < /a> < /h2> < !-- /post title --> < !-- button --> < a href="http://www.srcmini.com/< ?php the_permalink(); ?>" class="btn btn-outline-red rounded-0"> < b> READ MORE< /b> < /a> < br/> < !-- /button --> < !-- < span class="write" style="width:80% !important; "> < ?php the_excerpt(); // Dynamic Content ?> < /span> --> < br/> < ?php comments_template(); ?> < /article> < !-- /article --> < ?php endwhile; ?> < ?php get_the_posts_pagination(); ?> < ?php else: ?> < !-- article --> < article> < h1> < ?php _e( 'Sorry, nothing to display.', 'html5blank' ); ?> < /h1> < /article> < !-- /article --> < ?php endif; ?> < /section> < !-- /section --> < /main> < /div> < div class="col-12 col-md-6"> < /div> < /div> < /div> < /div> < /div>

#1好的。试试这个, 看看lmk是怎么回事。

< div class="amplify-content w-100 align-items-stretch order-0"> < div class="content-list"> < div class="mb-4"> < strong class="text-uppercase"> Category< /strong> Graphic Design Lab< /div> < div> < div> < div class="col-12"> < main role="main"> < !-- section --> < section class="bl row"> < ?php if (have_posts()): while (have_posts()) : the_post(); ?> < !-- article --> < article id="post-< ?php the_ID(); ?> " class="col-xs-12 col-sm-6"> < !-- post thumbnail --> < span class="blgimg"> < ?php if ( has_post_thumbnail()) : // Check if Thumbnail exists ?> < a href="http://www.srcmini.com/< ?php the_permalink(); ?>" title="< ?php the_title(); ?> "> < ?php the_post_thumbnail(); // Fullsize image for the single post ?> < /a> < ?php endif; ?> < /span> < !-- /post thumbnail --> < !-- post details --> < br/> < span class="date"> < ?php the_time('F j, Y'); ?> < ?php the_time('g:i a'); ?> < /span> < !-- /post details --> < !-- post title --> < h2 style="font-family: Journal-Regular; color: #d20a1e !important; text-transform: uppercase!important; " class="blgg"> < a href="http://www.srcmini.com/< ?php the_permalink(); ?>" title="< ?php the_title(); ?> "> < ?php the_title(); ?> < /a> < /h2> < !-- /post title --> < !-- button --> < a href="http://www.srcmini.com/< ?php the_permalink(); ?>" class="btn btn-outline-red rounded-0"> < b> READ MORE< /b> < /a> < br/> < !-- /button --> < !-- < span class="write" style="width:80% !important; "> < ?php the_excerpt(); // Dynamic Content ?> < /span> --> < br/> < ?php comments_template(); ?> < /article> < !-- /article --> < ?php endwhile; ?> < ?php get_the_posts_pagination(); ?> < ?php else: ?> < !-- article --> < article> < h1> < ?php _e( 'Sorry, nothing to display.', 'html5blank' ); ?> < /h1> < /article> < !-- /article --> < ?php endif; ?> < /section> < !-- /section --> < /main> < /div> < div class="col-12 col-md-6"> < /div> < /div> < /div> < /div> < /div>

【我想将我的wordpress帖子显示为2行，每行将包含2个帖子】另外, 你应该进入索引文件, 并将第53行替换为.blgimg img {width：100％; }而不是.blgimg img {width：250px; height：250px; }