zoukankan      html  css  js  c++  java
  • 布局的嵌套

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>BootStrap</title>
     6     <link type="text/css" rel="stylesheet" href="../../resources/bootstrap-2/css/bootstrap.css">
     7     <script type="text/javascript" src="../../resources/bootstrap-2/js/bootstrap.js"></script>
     8     <script type="text/javascript" src="../../resources/jQuery/jquery-1.12.4.min.js"></script>
     9 
    10 
    11     <script type="text/javascript" src="../../resources/js/html5.js"></script>
    12     <!--解决手机上的显示问题-->
    13     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    14     <!--解决IE低版本问题-->
    15     <!--[if lt IE9]>
    16     <script type="text/javascript" src="../../resources/js/html5.js"></script>
    17     <![endif]-->
    18 </head>
    19 <body>
    20 <div class="container">
    21     <h1 class="page-header">布局
    22         <small>使用BootStrap网格布局</small>
    23     </h1>
    24     <p>段落文字</p>
    25     <div class="row">
    26         <div class="span4">
    27             <h2 class="page-header">区块1</h2>
    28             <p>段落文字</p>
    29         </div>
    30         <div class="span4">
    31             <h2 class="page-header">区块2</h2>
    32             <p>段落文字</p>
    33         </div>
    34         <div class="span4">
    35             <h2 class="page-header">区块3</h2>
    36             <p>段落文字</p>
    37             <div class="row">
    38                 <div class="span2">布局的嵌套</div>
    39                 <div class="span2">布局的嵌套</div>
    40             </div>
    41         </div>
    42     </div>
    43 </div>
    44 </body>
    45 </html>

    对于区块3,其本身已经是占用了4个网格了,如果其下的内容要再二等分,就是各自再占用2个网格,并且这两个网格需要被row类包含

  • 相关阅读:
    hibernate中持久化对象的生命周期(转载)
    IDEA调试技巧之条件断点
    POI中不推荐的方法与其替代的方法
    visualvm监控类是否是多例模式
    IDEA中Maven项目使用Junit4单元测试的写法
    JPQL的关联查询
    poi的cellstyle陷阱,样式覆盖
    studio 连不上远程仓库的各种原因分析
    Concurrent usage detected
    我的SSH框架实例(附源码)
  • 原文地址:https://www.cnblogs.com/sherrykid/p/5744114.html
Copyright © 2011-2022 走看看