问答详情
源自:3-3 响应式布局之Bootstrap实际案例

<div class="clearfix visible-xs-block"></div> 这一句有什么用,为什么我缩小屏幕效果也显示不出来

在bootscript中,

<div class="row">
 <div class="col-xs-12 col-sm-6 col-md-8">.col-xs-12 .col-sm-6 .col-md-8</div>
 <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div></div><div class="row">
 <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
 <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
 <!-- Optional: clear the XS cols if their content doesn't match in height -->
 <div class="clearfix visible-xs-block">为什么显示不出效果</div>
 <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div></div>

为什么看不出效果,是不是最新版已经把这个问题修复了

提问者:微笑的馒头 2017-01-19 15:51

个回答

  • 昵称什么DE
    2017-03-28 16:42:59

    http://www.runoob.com/try/try2.php?filename=bootstrap3-gridsys-columnreset

    可以看到,这是用于调节手机显示的。初学者刚好碰到这个问题,不对请见谅

  • 慕粉1410236786
    2017-01-20 18:16:09

    <div class="row">
       <div class="col-md-8">.col-xs-12 .col-sm-6 .col-md-8</div>
       <div class="col-md-4">.col-xs-6 .col-md-4</div>
    </div>
    <hr>
    <div class="row">
       <div class=" col-sm-4">.col-xs-6 .col-sm-4</div>
       <div class=" col-sm-4">.col-xs-6 .col-sm-4</div>
    <!-- Optional: clear the XS cols if their content doesn't match in height -->
    <div class="clearfix visible-xs-block">为什么显示不出效果</div>
    <div class=" col-sm-4">.col-xs-6 .col-sm-4</div></div>

    有效果的,当页面<768的时候内容显示出来,否则是隐藏的.