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

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. 利用Django中的url方法实现地址动态拼接自动生成超链接地址

    目标 建立一个图书列表页面,显示图书名列表,并实现点击书名跳转到图书详细页面,显示图书详细信息. URL方法简介 功能:返回一个绝对路径的引用(不包含域名的URL):该引用匹配一个给定的视图函数和 一 ...

  2. C++11 随机数

    C++11带来诸多特性,random就是其一. 随机数由生成器和分布器结合产生 生成器generator:能够产生离散的等可能分布数值(需要种子,不然每次生存的随机数都一样) 分布器distribut ...

  3. 每日英语：Why Are Fractions Key To Future Math Success?

    Many students cruise along just fine in math until fourth grade or so. Then, they hit a wall -- frac ...

  4. python操作excel之 模块 xlrd

    xlrd是专门用来在python中读取微软execel的模块,可以自己直接下载安装,也可以通过包管理器安装. 官方资料: 下载地址:http://pypi.python.org/pypi/xlrd 官 ...

  5. python pip 升级

      首先安装python,在百度中搜索python,进入python官网.点击download,选择电脑对应的系统进行下载,此处以windows系统的python 3.5.1进行介绍,点击即可下载. ...

  6. org.eclipse.jdt.internal.compiler包下的类找不到

    到maven库上下载jar包:org.eclipse.jdt.core-3.13.jar <!-- https://mvnrepository.com/artifact/org.eclipse. ...

  7. war 宽度变窄

    1.打开开始菜单-运行-输入Regedit 打开注册表编辑器 展开 HKEY_CURRENT_USER 继续展开 Software继续展开 Blizzard Entertainment 在Warcra ...

  8. JS地毯式学习二

    1.递归算法 a. function box(num){if(num<=1){ return 1;}else{ return num*box(num-1);}}alert(box(5)); b. ...

  9. hbase计数器

    1 计数器 计数器可以方便.快速地进行计数操作,而且避免了加锁等保证了原子性的操作.   1.1 Java API 操作 HBase 计数器 public Result increment(final ...

  10. jsonp爬取页面

    jsonp Connection conn = Jsoup.connect("http://ip.taobao.com/service/getIpInfo.php?ip=" + i ...