<!DOCTYPE html>

    <html lang="en">

    ...

    </html>

bootstrap页面都应该包含html5声明。

框架：

1.<div class="container"> 固定布局，实现的简单的中央布局的页面，默认为940px宽。

    <body>

    <div class="container">

    ...

    </div>

    </body>

2.<div class="container-fluid">流式布局，提供灵活的页面结构，定义了最小和最大宽度，拥有一个左边栏。很适合做应用和文档。

    <div class="container-fluid">

    <div class="row-fluid">

    <div class="span2">

    <!--Sidebar content-->

    </div>

    <div class="span10">

    <!--Body content-->

    </div>

    </div>

    </div>

3.行的差分

    <div class="row"> 12格基本差分

    <div class="span4">...</div>

    <div class="span8">...</div>

    </div>
    <div class="row">12格带偏移量的差分

    <div class="span4">...</div>

    <div class="span4 offset4">...</div>中间相当于空了4个

    </div>
    <div class="row"> 列的内嵌 只需要在在一个存的的 span 中加入一个row 即可。fluid稍微有点不同

    <div class="span12">

    Level 1 of column

    <div class="row">

    <div class="span6">Level 2</div>

    <div class="span6">Level 2</div>

    </div>

    </div>

    </div>
    <div class="row-fluid">

    <div class="span12">

    Level 1 of column

    <div class="row-fluid">

    <div class="span6">Level 2</div>

    <div class="span6">Level 2</div>

    </div>

    </div>

    </div>

bootstrap基础知识点YI的更多相关文章

  1. <<Bootstrap基础教程>> 新书出手,有心栽花花不开,无心插柳柳成荫

    并非闲的蛋疼,做技术也经常喜欢蛋疼,纠结于各种技术,各种需求变更,还有一个很苦恼的就是UI总是那么不尽人意.前不久自己开源了自己做了多年的仓储项目(开源地址:https://github.com/he ...

  2. CSS 基础知识点 样式 选择器 伪类

    CSS 基础知识点汇集 版权声明:这篇博客是别人写的,大神博客地址 : https://www.cnblogs.com/Mtime/p/5184685.html 1.CSS 简介 CSS 指层叠样式表 ...

  3. fastclick 源码注解及一些基础知识点

    在移动端,网页上的点击穿透问题导致了非常糟糕的用户体验.那么该如何解决这个问题呢? 问题产生的原因 移动端浏览器的点击事件存在300ms的延迟执行,这个延迟是由于移动端需要通过在这个时间段用户是否两次 ...

  4. .NET基础知识点

    .NET基础知识点   l  .Net平台  .Net FrameWork框架   l  .Net FrameWork框架提供了一个稳定的运行环境,:来保障我们.Net平台正常的运转   l  两种交 ...

  5. Bootstrap <基础三十二>模态框（Modal）插件

    模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. 如果您想要单独引用该插件的功能,那么您需要引用  ...

  6. Bootstrap <基础三十一>插件概览

    在前面布局组件中所讨论到的组件仅仅是个开始.Bootstrap 自带 12 种 jQuery 插件,扩展了功能,可以给站点添加更多的互动.即使不是一名高级的 JavaScript 开发人员,也可以着手 ...

  7. Bootstrap <基础三十>Well

    Well 是一种会引起内容凹陷显示或插图效果的容器 <div>.为了创建 Well,只需要简单地把内容放在带有 class .well 的 <div> 中即可.下面的实例演示了 ...

  8. Bootstrap <基础二十九>面板（Panels）

    Bootstrap 面板(Panels).面板组件用于把 DOM 组件插入到一个盒子中.创建一个基本的面板,只需要向 <div> 元素添加 class .panel 和 class .pa ...

  9. Bootstrap <基础二十八>列表组

    列表组.列表组件用于以列表形式呈现复杂的和自定义的内容.创建一个基本的列表组的步骤如下: 向元素 <ul> 添加 class .list-group. 向 <li> 添加 cl ...

随机推荐

  1. WA（Write Amplification）写入放大

    WA是闪存及SSD相关的一个极为重要的属性.由于闪存必须先擦除才能再写入的特性,在执行这些操作时,数据都会被移动超过1次.这些重复的操作不单会增加写入的数据量,还会减少闪存的寿命,更吃光闪存的可用带宽 ...

  2. Vim 实用技术，第 1 部分: 实用技巧（转）

    原文链接:http://blog.jobbole.com/20604/ 0. Vim 简介 作为开源世界最重要的编辑器之一(另一个是 Emacs),Vim 以其强大的功能和可定制能力被众多开发者所喜爱 ...

  3. vb.net 操作xml

    xml文件: <?xml version="1.0" encoding="gb2312"?> <bookstore> <book ...

  4. Oracle 11g RAC features

    <一,> oracle 11g r2 RAC提供了以下功能: 高可用:shared-everything 模式保证了单节点的故障不会停止服务,集群中的其他节点将快速接管 可扩展性:多节点分 ...

  5. 【C++算法设计】八数码问题

    八数码问题 [题意] 编好为1~8的8个正方形滑块摆成3行3列(一个格子为空),如图所示 每次可以移动空格相邻的滑块到空格,要计算出能移动出目标局面的最小步数,如无法达到则输出-1. [分析] 我们可 ...

  6. class类的sizeof计算

    class no_virtual { public: void fun1() const{} int fun2() const { return a; } private: int a; } clas ...

  7. HEVC与VP9编码效率对比

    HEVC(High EfficiencyVideo Coding,高效率视频编码)是一种视频压缩标准,H.264/MPEG-4 AVC的继任者.目前正在由ISO/IEC MPEG和ITU-T VCEG ...

  8. CodeIgniter框架开发的统计程序源代码开放

    文章来源: PHP开发学习门户 自己初学php时,用CodeIgniter框架开发的后台统计程序源代码 程序部分页面如图: 具体配置及下载源代码:http://bbs.phpthinking.com/ ...

  9. linux 使用ssh到远端并且使用while的坑

    如果要使用ssh批量登录到其它系统上操作时,我们会采用循环的方式去处理,那么这里存在一个巨大坑,你必须要小心了. 现在是想用一个脚本获取远程服务器端/root下面的文件: #!/bin/bash ca ...

  10. Objective-c 数组对象

    首先我们必须知道数组的概念:数组是有序的对象集合,一般情况下,一个数组的对象都是相同类型的.数组当中也存在可变数组和不可变数组. 1. 不可变数组 (NSArray) 可变数组 NSMutable 是 ...