css - 使用 Wordpress 预览图像和 Bootstrap 换行

Question

我目前正在使用 bootstrap 开发一个 wordpress 主题，但我不知道如何在移动设备 View 中为我的帖子设置换行符。我想在预览图像的右侧至少有 4-5 个单词(目前它甚至在右侧显示单个单词，这看起来很傻)

我的首页代码如下所示:

<div class="content">

  <?php if (have_posts()) : ?>
    <?php while (have_posts()) : the_post(); ?>

      <div class="row"><!-- Row Start -->

        <div class="col-xs-12">

          <h1><?php the_title(); ?></h1>
        </div>
        <div class="col-xs-12">

          <?php if ( has_post_thumbnail() )
          echo '<div class="post_thumb">' . get_the_post_thumbnail(null, 'medium') . '</div>';
          ?>
          <?php the_excerpt(); ?>
          <a href="<?php the_permalink(); ?>">Weiter zum kompletten Beitrag</a>
        </div>
      </div>


      <div class="row trenner">
        <div class="col-xs-12"><hr></div>
      </div>

    <?php endwhile; ?>
  <?php endif; ?>

</div>

谢谢!

Answer 1

您可以采用两种方法，第一种是根据您的需要减小图像宽度，您的内容将自动显示在您想要的位置。或者您可以添加全宽图像，所有内容都将位于缩略图下方。为此，您必须在给定样式下应用此样式。

.post_thumb {
display: block;
text-align: center;
}

现在由您决定，哪个适合您。