用php启动bootstrap3网格

时间:2015-12-13 06:56:55

标签: php twitter-bootstrap-3 grid

我想做这样的事情:http://s12.postimg.org/u07k9qkt9/image.png

<div class="container-fluid">
  <h1>Hello World!</h1>

 <div class="row">

 <div class='col-lg-6'><h3>As melhores músicas para treinar no mês de todas as tentações</h1><h4>Desporto</h5> 
  <div class='row'>
  <div class='col-lg-3'><img src='img/ex1.JPG' class='img-thumbnail' width='200px' height='115px' /></div>
  <div class='col-lg-9'>
Lorem ipsum dolor sit amet, sed solum apeirian expetendis ad, nam assum latine apeirian ne, mea no omnis integre sententiae. Ea sea saperet qualisque repudiare, eam suas dolore gloriatur at, essent malorum tractatos eu quo. An per eruditi phaedrum. Voluptua prodesset voluptatum ut vel. Causae impedit et vis.
VER MAIS
2015-12-10 04:27:20</div>
  </div></div>

   <div class='col-lg-6'><h3>As melhores músicas para treinar no mês de todas as tentações</h1><h4>Desporto</h5> 
  <div class='row'>
  <div class='col-lg-3'><img src='img/ex1.JPG' class='img-thumbnail' width='200px' height='115px' /></div>
  <div class='col-lg-9'>
Lorem ipsum dolor sit amet, sed solum apeirian expetendis ad, nam assum latine apeirian ne, mea no omnis integre sententiae. Ea sea saperet qualisque repudiare, eam suas dolore gloriatur at, essent malorum tractatos eu quo. An per eruditi phaedrum. Voluptua prodesset voluptatum ut vel. Causae impedit et vis.
VER MAIS
2015-12-10 04:27:20</div>
  </div></div>


 </div>


  <div class="row">

 <div class='col-lg-6'><h3>As melhores músicas para treinar no mês de todas as tentações</h1><h4>Desporto</h5> 
  <div class='row'>
  <div class='col-lg-3'><img src='img/ex1.JPG' class='img-thumbnail' width='200px' height='115px' /></div>
  <div class='col-lg-9'>
Lorem ipsum dolor sit amet, sed solum apeirian expetendis ad, nam assum latine apeirian ne, mea no omnis integre sententiae. Ea sea saperet qualisque repudiare, eam suas dolore gloriatur at, essent malorum tractatos eu quo. An per eruditi phaedrum. Voluptua prodesset voluptatum ut vel. Causae impedit et vis.
VER MAIS
2015-12-10 04:27:20</div>
  </div></div>

   <div class='col-lg-6'><h3>As melhores músicas para treinar no mês de todas as tentações</h1><h4>Desporto</h5> 
  <div class='row'>
  <div class='col-lg-3'><img src='img/ex1.JPG' class='img-thumbnail' width='200px' height='115px' /></div>
  <div class='col-lg-9'>
Lorem ipsum dolor sit amet, sed solum apeirian expetendis ad, nam assum latine apeirian ne, mea no omnis integre sententiae. Ea sea saperet qualisque repudiare, eam suas dolore gloriatur at, essent malorum tractatos eu quo. An per eruditi phaedrum. Voluptua prodesset voluptatum ut vel. Causae impedit et vis.
VER MAIS
2015-12-10 04:27:20</div>
  </div></div>


 </div>



  <div class="row">

 <div class='col-lg-6'><h3>As melhores músicas para treinar no mês de todas as tentações</h1><h4>Desporto</h5> 
  <div class='row'>
  <div class='col-lg-3'><img src='img/ex1.JPG' class='img-thumbnail' width='200px' height='115px' /></div>
  <div class='col-lg-9'>
Lorem ipsum dolor sit amet, sed solum apeirian expetendis ad, nam assum latine apeirian ne, mea no omnis integre sententiae. Ea sea saperet qualisque repudiare, eam suas dolore gloriatur at, essent malorum tractatos eu quo. An per eruditi phaedrum. Voluptua prodesset voluptatum ut vel. Causae impedit et vis.
VER MAIS
2015-12-10 04:27:20</div>
  </div></div>

   <div class='col-lg-6'><h3>As melhores músicas para treinar no mês de todas as tentações</h1><h4>Desporto</h5> 
  <div class='row'>
  <div class='col-lg-3'><img src='img/ex1.JPG' class='img-thumbnail' width='200px' height='115px' /></div>
  <div class='col-lg-9'>
Lorem ipsum dolor sit amet, sed solum apeirian expetendis ad, nam assum latine apeirian ne, mea no omnis integre sententiae. Ea sea saperet qualisque repudiare, eam suas dolore gloriatur at, essent malorum tractatos eu quo. An per eruditi phaedrum. Voluptua prodesset voluptatum ut vel. Causae impedit et vis.
VER MAIS
2015-12-10 04:27:20</div>
  </div></div>


 </div>


</div>

但我想用php打印数据。我知道这不是正确的方法,我试过这样的事情,但它没有用:

<div class="container-fluid">
<h2> Últimos Artigos  </h2>

<?php

$query = "Select * from `artigos` INNER JOIN `categorias` ON artigos.id_categoria=categorias.id_categoria order by `data` desc";
$result = mysqli_query($con,$query);

while($row = mysqli_fetch_array($result,MYSQLI_ASSOC))
{
  $titulo = $row['titulo'];
  $corpo = $row['corpo'];
  $img = $row['img'];
  $data = $row['data'];
  $idart = $row['id_artigo'];
  $nomecat = $row['name_categoria'];

?>


<?php 
    echo " 
<div class='row'>
  <div class='col-lg-6'><h3>As melhores músicas para treinar no mês de todas as tentações</h1><h4>Desporto</h5> 
  <div class='row'>
  <div class='col-lg-3'><img src='img/ex1.JPG' class='img-thumbnail' width='200px' height='115px' /></div>
  <div class='col-lg-9'>
Lorem ipsum dolor sit amet, sed solum apeirian expetendis ad, nam assum latine apeirian ne, mea no omnis integre sententiae. Ea sea saperet qualisque repudiare, eam suas dolore gloriatur at, essent malorum tractatos eu quo. An per eruditi phaedrum. Voluptua prodesset voluptatum ut vel. Causae impedit et vis.
VER MAIS
2015-12-10 04:27:20</div>
  </div></div></div>";

}  
?>



</div>

1 个答案:

答案 0 :(得分:1)

尝试这样做

echo  <<< _END

   <div class='row'>
  <div class='col-lg-6'><h3>As melhores músicas para treinar no mês de todas as tentações</h1><h4>Desporto</h5> 
  <div class='row'>
  <div class='col-lg-3'><img src='img/ex1.JPG' class='img-thumbnail' width='200px' height='115px' /></div>
  <div class='col-lg-9'>
Lorem ipsum dolor sit amet, sed solum apeirian expetendis ad, nam assum latine apeirian ne, mea no omnis integre sententiae. Ea sea saperet qualisque repudiare, eam suas dolore gloriatur at, essent malorum tractatos eu quo. An per eruditi phaedrum. Voluptua prodesset voluptatum ut vel. Causae impedit et vis.
VER MAIS
2015-12-10 04:27:20</div>
  </div></div></div>

_END;