带有 Wordpress 预览图像和引导程序的换行符答案

【问题标题】：Line Breaks with Wordpress Preview Images and Bootstrap带有 Wordpress 预览图像和引导程序的换行符
【发布时间】：2016-04-29 09:19:35
【问题描述】：

我目前正在使用 bootstrap 开发 wordpress 主题，但我不知道在移动视图中如何在我的帖子上设置换行符。我希望在预览图像的右侧至少有 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>

谢谢！

【问题讨论】：

标签： css wordpress twitter-bootstrap line-breaks

【解决方案1】：

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

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

现在由你决定，哪一个适合你。

【讨论】：

【解决方案2】：

图片太大，右侧无法容纳 4-5 个字，因此请使用缩略图（或设置适合您的设计理念的宽度的图片大小）而不是 medium 作为 get_the_post_thumbnail 的第二个参数

【讨论】：