2016-11-14 2 views
0

Если я использую «для цикла», все данные из Db представлены вертикально. Я написал пример без HTML, для прозрачности. А второй код «my.html» - с кодом HTML. Я хочу быть дивизиями (или таблицей), отображаемыми по горизонтали. Если я запустил my.html, я получил два раздела, отображаемых по вертикали, как я могу поместить их по горизонтали? Я хочу отображать два раздела (или таблицы) рядом друг с другом по горизонтали, а значения, такие как post.prop_one, должны отображаться вертикально в разделе или таблице.Использование для циклов для отправки значений в шаблоне django

{% for post in posts %} 
    {{post.option_one}} 
    {{post.option_two}} 
{% endfor %} 

my.html

<!-- myprices --> 
     <div id="pricing" class="container-fluid"> 
    <div class="text-center"> 
       <h2>Pricing</h2> 
        <h4>blabla</h4> 
</div> {% for post in posts %} 
       <div class="row slideanim-'inline'"> 
       <div class="col-sm-4 col-xs-12"> 

        <div class="panel panel-default text-center"> 
        <div class="panel-heading"> 

        <h1><a href="">{{ post.offer_option}}</a></h1> 
        </div> 
         <div class="panel-body"> 
          <p><strong>20</strong> {{post.prop_one}}</p> 
          <p><strong>20</strong>{{post.prop_two}} </p> 
          <p><strong>20</strong>{{post.prop_three}}</p> 
         </div> 
         <div class="panel-footer"> 
         <h3>{{ post.price}}</h3> 
         <h4>{{ post.period}}</h4> 
         </div> 
         <button class="btn btn-lg">Sign Up</button> 
        </div> 
        </div> 
       </div> 
        {% endfor %} 
+0

положить две таблицы в другую таблицу. Или используйте классы 'bootstrap', такие как' 'col-sm-4 col-xs-12'' – furas

+0

Ваш вопрос непонятен. Вы хотите отображать элементы в таблице горизонтально (т. Е. В одной строке таблицы) или вы хотите отображать две целые таблицы рядом друг с другом по горизонтали? –

+0

Кроме того, ваш пример кода вообще не использует таблицы, поэтому ваш вопрос еще более неясен. –

ответ

0

You петля весь content..all вы хотите петли col-sm-4 col-xs-12. Ваши «for loop» и finaltag неправильно помещены в ваш html. Пример:

 <!-- Container (Pricing Section) --> 
<div id="pricing" class="container-fluid"> 
    <div class="text-center"> 
    <h2>Pricing</h2> 
     <h4>blabla</h4> 
    </div> 

    <div class="row slideanim-'inline'"> 
     {% for post in posts %} 
    <div class="col-sm-4 col-xs-12"> 


     <div class="panel panel-default text-center"> 
     <div class="panel-heading"> 

     <h1><a href="">{{ post.offer_option}}</a></h1> 
     </div> 
      <div class="panel-body"> 
       <p><strong>20</strong> {{post.prop_one}}</p> 
       <p><strong>20</strong>{{post.prop_two}} </p> 
       <p><strong>20</strong>{{post.prop_three}}</p> 
      </div> 
      <div class="panel-footer"> 
      <h3>{{ post.price}}</h3> 
      <h4>{{ post.period}}</h4> 
      </div> 
      <button class="btn btn-lg">Sign Up</button> 
     </div> 

     </div>{% endfor %} 
    </div> 
Смежные вопросы