如何使数据库查询结果与页面现有<li>元素样式保持一致？

很简单，你只需要把数据库查询到的每个主题用<li>标签包裹起来，就能让返回内容和现有<li>元素的样式完全统一了。修改后的完整代码如下：

<div class="row content"> 
  <ul class="nav nav-pills nav-stacked"> 
    <li class="active"><a href="#section1">Home</a></li> 
    <li><a href="#section2">Friends</a></li> 
    <li><a href="#section3">Family</a></li> 
    <li><a href="#section3">Photos</a></li> 
    <?php 
      $toppics = $app->get_topics(); 
      foreach ($toppics as $topic) { 
          // 用<li>标签包裹数据库返回的主题内容
          echo '<li>' . $topic['onderwerp'] . '</li>'; 
      } 
    ?> 
  </ul><br> 
</div>

改动说明 #

原来的代码只是直接输出文本加换行符<br>，现在替换成用<li>标签包裹每个$topic['onderwerp']，这样每个数据库返回的主题都会成为<ul>列表里的标准列表项，自动继承nav-pills nav-stacked这些样式类的效果，和前面的Home、Friends等条目保持视觉一致。

内容的提问来源于stack exchange，提问作者youarewelkommmornot