Bootstrap框架
1.以栅栏式布局，分12列，16列，24列和32列，常用12列。
2.整个页面必须在container容器内部
3.移动端以 <meta name="viewport" content="width=device-width,initial-scale=1.0">
来使视图一比一缩放。（响应式布局）
4.载入bootstrap时需要经过七个步骤，才能支持CSS，js，IE，IE8以下等

a.引入bootstrap框架 <link rel="stylesheet" href="../bootstrap.min.css">

b.引入JQuery框架。引入在body结束标签之前。

c.引入JS文件，在JQuery框架之后引入。

d.引入移动端适应<meta name="viewport" content="width=device-width,initial-scale=1.0">。

e.将html标签添加<html lang="zh-cn">

f.若支持IE得在meta标签，得添加<meta http-equiv="X-UA-Compatible" content="IE=edge">。

g。若要支持IE8之前，需添加responds。js文件
缺点：
1.规定好的写法布局太死板，写出来的网站风格同质化严重.
2.IE678的兼容性可能不太好，需要复写大量样式，CSS层次的混乱，难以维护.
3.bootstrap的class类定义杂乱，没有统一的格式，在比较复杂的页面中，容易产生覆盖和冲突.

优点：
1.bootstrap方便快速上手，做响应式设计比较方便.
2.bootstrap拥有完善的文档，这样可以加快学习的进程
3.Bootstrap 提供很多方法来自定义它的默认设计，可以覆盖它所有默认的CSS和JavaScript的行为.

Bootstrap个人总结的更多相关文章

  1. 旺财速啃H5框架之Bootstrap（五）

    在上一篇<<旺财速啃H5框架之Bootstrap(四)>>做了基本的框架,<<旺财速啃H5框架之Bootstrap(二)>>篇里也大体认识了bootst ...

  2. 旺财速啃H5框架之Bootstrap（四）

    上一篇<<旺财速啃H5框架之Bootstrap(三)>>已经把导航做了,接下来搭建内容框架.... 对于不规整的网页,要做成自适应就有点玩大了.... 例如下面这种版式的页面. ...

  3. bootstrap + requireJS+ director+ knockout + web API = 一个时髦的单页程序

    也许单页程序(Single Page Application)并不是什么时髦的玩意,像Gmail在很早之前就已经在使用这种模式.通常的说法是它通过避免页面刷新大大提高了网站的响应性,像操作桌面应用程序 ...

  4. 参考bootstrap中的popover.js的css画消息弹框

    前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...

  5. Bootstrap 模态框(Modal)插件

    页面效果: html+js: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  6. 利用bootstrap的carousel.js实现轮播图动画

    前期准备: 1.jquery.js. 2.bootstrap的carousel.js. 3.bootstrap.css. 如果大家不知道在哪下载,可以联系小颖,小颖把这些js和css可以发送给你. 一 ...

  7. 旺财速啃H5框架之Bootstrap（三）

    好多天没有写了,继续走起 在上一篇<<旺财速啃H5框架之Bootstrap(二)>>中已经把CSS引入到页面中,接下来开始写页面. 首先有些问题要先处理了,问什么你要学boot ...

  8. 旺财速啃H5框架之Bootstrap（二）

    突然感觉不知道写啥子,脑子里面没水了,可能是因为今晚要出去浪,哈哈~~~提前提醒大家平安夜要回家哦,圣诞节生00000000000这么多蛋....继续 上一篇的已经把bootstrap了解个大概了,接 ...

  9. 旺财速啃H5框架之Bootstrap（一）

    接下来的时间里,我将和大家一起对当前非常流行的前端框架Bootstrap进行速度的学习,以案例的形式.对刚开始想学习Bootstrap的同学而找不着边的就很有帮助了.如果你想详细的学习Bootstra ...

  10. [BootStrap] 富编辑器，基于wysihtml5

    在我的周围,已经有很多人在使用BootStrap,但对于任何一个带留言.评论.提问.文章编辑功的网站,编辑器永远是重中之重,显然,早期的编辑器完全没考虑过BootStrap的出现,或皮肤跟网站不匹配, ...

随机推荐

  1. Raid与DAN、SAN、NAS基础

    一. 磁盘基本知识 1. Raid分类 Raid磁盘阵列是由多个磁盘组合成的磁盘组,可将数据分割成许多区段,分别存放在各个磁盘上:同时利用不同排列技术,可提高磁盘性能和数据安全性.下列简单介绍几种Ra ...

  2. R笔记 单样本t检验 功效分析

    R data analysis examples 功效分析 power analysis for one-sample t-test单样本t检验 例1.一批电灯泡,标准寿命850小时,标准偏差50,4 ...

  3. PHP常量、变量作用域详解（一）

    PHP 中的每个变量都有一个针对它的作用域,它是指可以在其中访问变量(从而访问它的值)的一个领域.对于初学者来说,变量的作用域是它们所驻留的页面.因此, 如果你定义了 $var,页面余下部分就可以访问 ...

  4. Daily Scrum Meeting ——TenthDay

    一.Daily Scrum Meeting照片 二.Burndown Chart 新增了几个issues 三.项目进展 1.完成了登录界面与管理员和发布者界面的整合. 2.活动发布者界面的完成 四.问 ...

  5. angular-ui-bootstrap-modal必须要说的几个点(转)

    angular-ui-bootstrap-modal必须要说的几个点 摘要: 基于angular来实现的一个bootstrap模态框,有些不得不说的地方 项目中以前就经常用到模态框,但是一直没有时间来 ...

  6. PHP学习-验证用户名密码

    登录页:login.php <?php //登录 if(!isset($_POST['submit'])){exit('非法访问!');} $username = $_POST['adname' ...

  7. Java 计算数学表达式（字符串解析求值工具）

    Java字符串转换成算术表达式计算并输出结果,通过这个工具可以直接对字符串形式的算术表达式进行运算,并且使用非常简单. 这个工具中包含两个类 Calculator 和 ArithHelper Calc ...

  8. C++虚函数浅探

    C++中和虚函数(Virtual Function)密切相关的概念是"动态绑定"(Dynamic Binding),与之相对的概念是"静态绑定"(Static ...

  9. 设置UITableView的separatorInset值为UIEdgeInsetsZero，分隔线不最左端显示的问题

    一.问题描述 UITableView分割线要显示到最左端 查看UITableView的属性,发现设置separatorInset的值可以自定义分割线的位置. @property (nonatomic) ...

  10. 编辑 Ext 表格（二）——— 编辑表格元素

    一.编辑单元格 Ext 中通过配置表格的属性 plugins 来设置表格是否可编辑, 表格的配置具体如下: var gridTable = Ext.create('Ext.grid.Panel', { ...