我爱编程

Bootstrap 栅格系统

2018-02-23  本文已影响25人  ugvibib
栅格参数
<div class="container">    # container声明宽度 container-fluid布局满屏显示
  # 大屏幕 桌面
  <div class="row">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
      <div class="visible-lg">lg尺寸时可见</div>
      <div class="visible-md">md尺寸时可见</div>
      <div class="visible-sm">sm尺寸时可见</div>
      <div class="visible-xs">xs尺寸时可见</div>
    </div>
    <div class="row">
      <div class="col-lg-3"></div>
      <div class="clearfix"></div>    # 清除列高度
      <div class="col-lg-3 col-lg-offset-2"></div>    偏移2格,会出现空白区域
      <div class="col-lg-3 col-md-push-9"></div>  列向右移动9个单位
      <div class="col-lg-3 col-md-pull-9"></div>
      <div class="col-lg-3"></div>

    </div>
    # 支持列嵌套,每个列都相当于一个row,可分12格
  </div>
</div>

注:示例代码只是记录功能。不做规范要求

上一篇 下一篇

猜你喜欢

热点阅读