标注下，正好最近关注前段框架

1. CSS-12栅格系统

把网页宽度均分为12等分（保留15位精度）——这是bootstrap的核心功能。

2.基础布局组件

包括排版、按钮、表格、布局、表单等等。

3.jQuery

bootstrap插件的基础

4.响应式设计

兼容多个终端。这是bootstrap的终极理念。

5.css插件

提供丰富的样式。

6.js插件

二. 栅格系统

1.基本实现过程

定义容器的大小——跳转边距——媒询

有以下要求：

（1）一行（row）数据必须包含在.container中。

.container默认居中。宽度分为4种，超小屏（100%），小屏（750px），中屏（970px），大屏（1170px）。row的边距（左右margin，下同）是-15px。

（2）有了row，才能搭建列（col）。所有组件必须放在col内，只有col才能作为row的直接子元素。

.col的左右内边距（padding-left,right）为15px。也就是说，最小的col有30px。

（3）在以上基础上快速搭建布局

（4）col之间是木有边距的，应当使用padding来产生col的视觉距离。这样做会导致一个row容不下12个col，这时应当用负的margin来抵消padding的影响。

（5）栅格系统是通过指定1-12的值来设定范围的。对于col的规格，开发者指定了4个不同的屏幕

如图，在<body class="container">内包含若干个<div class="col-md-“1-12数字”">col-md-“1-12数字”></div>效果是

具体的可以参考原文

http://www.jb51.net/article/94304.htm

深入理解bootstrap框架之第二章整体架构的更多相关文章

  1. 《深入理解bootstrap》读书笔记：第二章 整体架构

    一.  整体架构   1. CSS-12栅格系统 把网页宽度均分为12等分(保留15位精度)--这是bootstrap的核心功能. 2.基础布局组件 包括排版.按钮.表格.布局.表单等等. 3.jQu ...

  2. 徒手用Java来写个Web服务器和框架吧<第二章:Request和Response>

    徒手用Java来写个Web服务器和框架吧<第一章:NIO篇> 接上一篇,说到接受了请求,接下来就是解析请求构建Request对象,以及创建Response对象返回. 多有纰漏还请指出.省略 ...

  3. 《深入理解java虚拟机》第二章 Java内存区域与内存溢出异常

    第二章 Java内存区域与内存溢出异常 2.2 运行时数据区域  

  4. Struts2框架学习第二章——Struts2下的HelloWorld

    本章要点 —  Struts 2的下载和安装 — 纯手工创建一个Web应用 — 纯手工创建一个Struts 2应用 — 实现Struts 2的Action — 配置Struts 2的Action — ...

  5. Artech的MVC4框架学习——第二章URL路由

    总结:HttpModule 和HttpHandler是Asp.net管道的两个重要组件.请求最终处理通过HttpHandler完成.MVC就是通过名为MvcHandler自定义HttpHandler现 ...

  6. 深入理解java虚拟机_第二章_读书笔记

    1.本章内容目录: 概述 运行时数据区域 程序计数器 java虚拟机栈 本地方法栈 java堆 方法区 运行时常量池 直接内存 HotSpot虚拟机对象探秘 对象的创建 对象的内存布局 对象的访问定位 ...

  7. 架构探险——从零开始写Java Web框架》第二章照作

    沉下来慢慢看实现了. 越来越觉得可以和DJANGO作对比. package org.smart4j.chapter2.model; /** * Created by sahara on 2016/3/ ...

  8. 《深入理解linux内核》第二章 内存寻址

    三种不同的内存地址 逻辑地址(logical address)包含在linux实际指令中的地址,即分段式地址,是对应的硬件平台段式管理转换前地址由16位的段选择符(segment selector)和 ...

  9. 《深入理解JAVA虚拟机》----------第二章 JAVA内存区域与内存溢出异常，笔记（下）

    2. HotSpot虚拟机对象探秘 2.1 对象的创建 虚拟机遇到一条New指令时,首先将去检查这个指令的参数是否能在常量池中定位到一个类的符号引用,并且检查这个符号引用代表的类是否已被加载.解析和初 ...

随机推荐

  1. 关于DDR3非常棒的文章

    xilinx平台DDR3设计教程之仿真篇   http://wenku.baidu.com/view/c452d9a5524de518964b7dca.html?pn=50

  2. [sh]. 点的含义

    . 的含义 当前目录 隐藏文件 任意一个字符 生效配置文件

  3. 【ActiveMQ】ActiveMQ在CentOS的搭建与使用

    下载 到ActiveMQ官网,找到下载点. 目前, 官网为http://activemq.apache.org/. 我们下载目前最新的版本吧,当前的Linux版本下载地址之一为:http://apac ...

  4. StructureMap

    In one of my projects (.NET based - using the Web API), I am using StructureMap as a dependency inje ...

  5. BSD Socket~TCP~Example Code

    TCP 协议实现 C版本号,可用于Mac OS X机器上执行 Server: /* Setting up a simple TCP server involves the following step ...

  6. object not serializable (class: org.apache.kafka.clients.consumer.ConsumerRecord)

    3. object not serializable (class: org.apache.kafka.clients.consumer.ConsumerRecord)   val stream = ...

  7. 【WPF】获取下拉列表(ComboBox)的选项(ComboBoxItem)的内容

    需求:给下拉列表ComboBox注册一个选项改变时触发的事件,想要获取到当前选中的选项的内容. // 给ComboBox注册一个选项改变的事件 myComboxBox.SelectionChanged ...

  8. 百兆千兆网口100Base-TX/1000Base-T

    100Base-TX快速以太网目前制定的三种有关传输介质的标准之一. 另外两种是100Base-T4,100Base-FX. 100标识传输速率为100Mbit/s. base标识采用基带传输. T代 ...

  9. SQL与NoSQL的CRUD对照

    SQL与NoSQL的CRUD对照 flyfish 2015-7-21 Create, Read, Update and Delete (CRUD) SQL方式 查 SELECT 列名称 FROM 表名 ...

  10. EcmaScript对象克隆之谜

    先谈谈深拷贝 如何在js中获得一个克隆对象,可以说是喜闻乐见的话题了.相信大家都了解引用类型与基本类型,也都知道有种叫做深拷贝的东西,传说深拷贝可以获得一个克隆对象!那么像我这样的萌新自然就去学习了一 ...