<!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. VM Agent 和扩展程序

    VM Agent 和扩展程序 - 第 1 部分  Windows Azure基础结构服务最近宣布了一项新功能VM Agent.VMAgent是一个轻量级进程,用于启动由Microsoft或合作伙伴 ...

  2. hdu4491 Windmill Animation(计算几何)

    Windmill Animation Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Other ...

  3. SDOI(队列)

    SDOI Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others) Total Sub ...

  4. <td style="word-break:break-all"> 在html中控制自动换行

    在html中控制自动换行   其实只要在表格控制中添加一句 <td style="word-break:break-all">就搞定了. 其中可能对英文换行可能会分开一 ...

  5. 七日筑基——C#第一天（下）

    继续C#第一天的内容,昨天我们简单说了一下如何用C#代码来让学生做自我介绍,介绍的格式要求:“我叫威震天,今年20岁,我喜欢踢足球和上网,希望接下来的三年能跟大家一起成长.”威震天介绍完了,继续下一个 ...

  6. Node.js笔记1

    Node.js入门笔记 1. node -help 可以显示帮助信息2. node REPL 模式(Read-eval-print loop) 输入—求值—输出循环 直接在cmd输入node 可以进入 ...

  7. javascript的函数相关属性和方法

    作为一名前端初学者,应该坚持每天去学习,去总结 ,去复习,去接触更新鲜的事物.但是这段时间很浮躁,虽说也是在一直学习,自己能吸收的少之又少.今日在这突然冒出来,实感惭愧. 1.函数名.name 获得函 ...

  8. .net-一般处理程序及生命周期

    IsReusable属性用来表示在IHttpHandlerFactory对象创建IHttpHandler的时候是否能够将这个Handler存入池中以便重用. 一般处理程序(HttpHandler):是 ...

  9. zoj 3490

    蛋都疼了,高了半天,Output Limit Exceeded 原来是输入的问题,我靠!!以后还是用输入输出c++好,这尼玛!!郁闷!!!!! #include<stdio.h> #inc ...

  10. JavaScript使用button提交表单

    <form action="test.html" method="POST"> <input type="button" ...