PHP&；HTML-不带换行符的echo li标记

我有以下代码：

 <ol>
    <?php foreach ($articles as $article) { ?>
    <li>
        <img src="public_html/images/example.jpg" height="250" width="250">
        <br />
        <a href="public_html/article.php?id=<?php echo 
$article['article_id'];?>">
            <?php echo $article['article_title'];?>
        </a>
        - <small>
            posted <?php echo date('l jS', $article['article_timestamp'])?>
        </small>
    </li>
    <?php } ?>
</ol>

我希望它是我的印刷品，像这样：

img      img     img     ...
title    title   title

<div class="container">
  <ol class="row">
    <?php foreach ($articles as $article) { ?>
     <li class="col-sm">
        <img src="public_html/images/example.jpg" height="250" width="250">
        <br />
        <a href="public_html/article.php?id=<?php echo $article['article_id'];?>">
           <?php echo $article['article_title'];?>
        </a>
      - <small>
           posted <?php echo date('l jS', $article['article_timestamp'])?>
        </small>
      </li>
    <?php } ?>
  </ol>
</div>

我试着在div标签中断线或使用，但它不起作用。 我该怎么做

thank’s

一种方法是使用，然后您的代码将如下所示：

img      img     img     ...
title    title   title

<div class="container">
  <ol class="row">
    <?php foreach ($articles as $article) { ?>
     <li class="col-sm">
        <img src="public_html/images/example.jpg" height="250" width="250">
        <br />
        <a href="public_html/article.php?id=<?php echo $article['article_id'];?>">
           <?php echo $article['article_title'];?>
        </a>
      - <small>
           posted <?php echo date('l jS', $article['article_timestamp'])?>
        </small>
      </li>
    <?php } ?>
  </ol>
</div>

- 
张贴

---

别忘了将引导CSS文件安装到您的代码中

我建议您查看类似CSS网格的内容，以获得所需的布局。但解决这个问题的一个简单方法是将列表项向左浮动。在代码之前包含以下样式标记：

<style>
ul li { float:left;}
</style>
<ol>
    <?php foreach ($articles as $article) { ?>
    <li>
        <img src="public_html/images/example.jpg" height="250" width="250">
        <br />
        <a href="public_html/article.php?id=<?php echo 
$article['article_id'];?>">
            <?php echo $article['article_title'];?>
        </a>
        - <small>
            posted <?php echo date('l jS', $article['article_timestamp'])?>
        </small>
    </li>
    <?php } ?>
</ol>

ul li{浮动：左；}



- 
张贴

您可以使用简单的css：

li {
display: inline-block;
}

---

您是否先尝试自己解决此问题？这是有序和无序列表（UL/OL）的默认行为，即列表项（LI）是块级元素。您必须为li提供一个样式显示：block-inline。请考虑使用类似引导的框架：