删除帖子之间的空间[bootstrap]

时间:2015-06-02 22:33:10

标签: javascript jquery html css twitter-bootstrap

我需要删除没有图片的帖子和帖子下面的空格,这里是图片,所以如果帖子没有图片,那帖子下面不应该有空格:

enter image description here

这是代码:

<div class="container">
           <div class="row">
            <div class="col-sm-4 col-md-4">

                      <img src="http://placehold.it/460x250/e67e22/ffffff&text=HTML5" class="img-responsive" />
                    <div class="content">
                        <h4>NASLOV</h4>
                       <p>
                           Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
                           Ipsum has been the industry's standard dummy text ever since the 1500s, when an
                           unknown printer took a galley of type and scrambled it to make a type specimen book.
                       </p>
                   </div>

           </div>
           <div class="col-sm-4 col-md-4">

                      <img src="http://placehold.it/460x250/e67e22/ffffff&text=HTML5" class="img-responsive" />
                    <div class="content">
                        <h4>NASLOV</h4>
                       <p>
                           Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
                           Ipsum has been the industry's standard dummy text ever since the 1500s, when an
                           unknown printer took a galley of type and scrambled it to make a type specimen book.
                       </p>
                   </div>

           </div>
           <div class="col-sm-4 col-md-4">

                      <img src="http://placehold.it/460x250/e67e22/ffffff&text=HTML5" class="img-responsive" />
                    <div class="content">
                        <h4>NASLOV</h4>
                       <p>
                           Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
                           Ipsum has been the industry's standard dummy text ever since the 1500s, when an
                           unknown printer took a galley of type and scrambled it to make a type specimen book.
                       </p>
                   </div>

           </div>
           <div class="col-sm-4 col-md-4">

                      <img src="http://placehold.it/460x250/e67e22/ffffff&text=HTML5" class="img-responsive" />
                    <div class="content">
                        <h4>NASLOV</h4>
                       <p>
                           Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
                           Ipsum has been the industry's standard dummy text ever since the 1500s, when an
                           unknown printer took a galley of type and scrambled it to make a type specimen book.
                       </p>
                   </div>

           </div>

           <div class="col-sm-4 col-md-4">

                      <img src="http://placehold.it/460x250/e67e22/ffffff&text=HTML5" class="img-responsive" />
                    <div class="content">
                        <h4>NASLOV</h4>
                       <p>
                           Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
                           Ipsum has been the industry's standard dummy text ever since the 1500s, when an
                           unknown printer took a galley of type and scrambled it to make a type specimen book.
                       </p>
                   </div>

           </div>
           <div class="col-sm-4 col-md-4">

                      <img src="http://placehold.it/460x250/e67e22/ffffff&text=HTML5" class="img-responsive" />
                    <div class="content">
                        <h4>NASLOV</h4>
                       <p>
                           Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
                           Ipsum has been the industry's standard dummy text ever since the 1500s, when an
                           unknown printer took a galley of type and scrambled it to make a type specimen book.
                       </p>
                   </div>

           </div>

            <div class="col-sm-4 col-md-4">

                      <img src="http://placehold.it/460x250/e67e22/ffffff&text=HTML5" class="img-responsive" />
                    <div class="content">
                        <h4>NASLOV</h4>
                       <p>
                           Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
                           Ipsum has been the industry's standard dummy text ever since the 1500s, when an
                           unknown printer took a galley of type and scrambled it to make a type specimen book.
                       </p>
                   </div>

           </div>
    </div>
 </div>

这里是直播:http://www.bootply.com/sfmRGTiKS4 任何的想法? :)

1 个答案:

答案 0 :(得分:0)

要获得您想要的内容,您的模板不必按行排列,而只能以这种方式排列,每列中的元素将在彼此之下,而不会受到行所施加的空间限制。为此,请删除外部<div class="row">