zoukankan      html  css  js  c++  java
  • bootstrap笔记-栅格布局

    1.   .clearfix

    这个类可以在栅格布局中起到一个不占空间的clear的作用,如下:可以尝试带.clearfix和不带它的区别

    <div class="container-fluid" >
        <div class="row">
            <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3Resize your viewport or check it out on your phone for an example. </div>
            <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
    
            <div class="clearfix visible-xs-block"></div>
    
            <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
            <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
        </div>
    </div>

    2.在col栅格内再增加.row可以再次嵌套   内部嵌套满12则占满这个col栅格,不满则只占该col栅格的X/12。

    3.通过使用 .col-md-push-*.col-md-pull-* 类就可以很容易的改变列(column)的顺序。  ???

    push将在前,pull将在后

    4.栅格总结:row应该在container或者container-fluid中,col应该在row中,col-xs-x决定了占十二分之几的大小,offset将按12百分比来向右偏移,.clearfix可以不占位置的清楚两边,push在前pull在后

  • 相关阅读:
    Python2-列表
    C#1-变量和表达式
    Python1-变量
    grep输出带有颜色设置
    ftp服务器的安装与使用
    慕课网-哒哒租车系统
    ulimit 命令
    ARP与RARP
    return 和exit
    java运行机制
  • 原文地址:https://www.cnblogs.com/xisitan/p/4873887.html
Copyright © 2011-2022 走看看