本文在于巩固基础

学习bootStrap官网http://getbootstrap.com/

响应式布局是Ethan Marcotte在2010年5月份提出的一个概念，简而言之，就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。响应式布局可以为不同终端的用户提供更加舒适的界面和更好的用户体验，而且随着目前大屏幕移动设备的普及，用大势所趋来形容也不为过。随着越来越多的设计师采用这个技术，我们不仅看到很多的创新，还看到了一些成形的模式。

而bootStrap是响应式布局的一个很好框架

优点和缺点

优点
面对不同分辨率设备灵活性强
能够快捷解决多设备显示适应问题
缺点
兼容各种设备工作量大，效率低下
代码累赘，会出现隐藏无用的元素，加载时间加长
其实这是一种折中性质的设计解决方案，多方面因素影响而达不到最佳效果
一定程度上改变了网站原有的布局结构，会出现用户混淆的情况
 

响应式布局之BootStrap的更多相关文章

  1. 响应式布局与bootstrap框架

    原文 网页布局方式 1.固定宽度布局:为网页设置一个固定的宽度,通常以px做为长度单位,常见于PC端网页. 2.流式布局:为网页设置一个相对的宽度,通常以百分比做为长度单位. 3.栅格化布局:将网页宽 ...

  2. 响应式布局和BootStrap 全局CSS样式

    1.什么是响应式布局 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,这个概念是为解决移动互联网浏览而诞生的. 简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一 ...

  3. 15、响应式布局和BootStrap 全局CSS样式知识点总结-part2

    1.表格 <div class="container"> <table class="table "> <thead> &l ...

  4. 14、响应式布局和BootStrap 全局CSS样式知识点总结-part1

    1.什么是响应式布局 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,这个概念是为解决移动互联网浏览而诞生的. 简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一 ...

  5. 响应式布局及bootstrap（实例）

    说明: 这几天公司要求网站实现响应式布局,所以对响应式布局进行了相对全面的了解,并做了几个实例. 转载请注明源地址,谢谢^_^,http://www.cnblogs.com/liu-zhen/p/44 ...

  6. 16、响应式布局和BootStrap 全局CSS样式知识点总结-part3

    1.响应式工具 ①可用的类 <div class="container"> <a href="#" class="visible-x ...

  7. 前端入门24-响应式布局（BootStrap）

    声明 本篇内容摘抄自以下两个来源: BootStrap中文网 感谢大佬们的分享. 正文-响应式布局(BootStrap) 这次想来讲讲一个前端开发框架:BootStrap BootStrap 目前已经 ...

  8. asp.net MVC通用权限管理系统-响应式布局-源码

    一.Angel工作室简单通用权限系统简介 AngelRM(Asp.net MVC Web api)是基于asp.net(C#)MVC+前端bootstrap+ztree+lodash+jquery技术 ...

  9. web前端学习（二）html学习笔记部分（9）-- 响应式布局

    1.2.23  响应式布局基础 1.2.23.1  响应式布局介绍 1.响应式布局是2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多终端 -- 而不是为每个终端做一个特定的版本.这个概 ...

随机推荐

  1. WINDOWS 下搭建 OC 集成开发环境

    Objective-C是苹果软件的编程语言,想要上机学习.调试,有一个集成开发环境(IDE)方便很多.有三类方法搭建Objective-C的集成开发环境: 1)   使用苹果的平台,集成开发环境使用X ...

  2. python中使用mahotas包实现高斯模糊

    高斯模糊 import mahotas as mh import numpy as np from matplotlib import pyplot as plt image=mh.imread('i ...

  3. lua 类实现

    Class={}; Class.classList={}; --保存所有已经定义过的类 --类的类型: 类和接口, 接口也是一种类 Class.TYPE_CLASS="Class" ...

  4. 【Java基础】可变参数

    下面是一个简单的小程序: import java.util.Arrays; class lesson6 { public static void main(String[] args) { ,,,,, ...

  5. React-Native 获取node.js提供的接口

    一个简单的React-Native 获取node.js提供的接口的实现 一.node.js var http = require("http"); var url = requir ...

  6. dojo.byId、dojo.query、dojo.attr

    概述: dojo.byId(/*string*/id或/*DomNode*/node) 1.传入DOMNode返回传入的domNode; 2.传入id返回id为当前值的domNode dojo.que ...

  7. NSDictionary初始化，使用@{}方法，插入nil时会报空指针异常

    由于今天在NSDictionary初始化的时候出现Crash异常,故记录一下,避免下次再犯. 在Objective-C中,NSDictionary初始化的方法有很多种 方法1: [NSDictiona ...

  8. hadoop高可用集群搭建小结

    hadoop高可用集群搭建小结1.Zookeeper集群搭建2.格式化Zookeeper集群 (注:在Zookeeper集群建立hadoop-ha,amenode的元数据)3.开启Journalmno ...

  9. Qt 编程训练之七

    Qt进程间通信 TCP / IP 跨平台的 QtNetwork模块提供的类网络编程便携式和容易. 它提供了高层类(例如,QNetworkAccessManager, QFtp)使用特定的应用层协议通信 ...

  10. C++程序设计实践指导1.9统计与替换字符串中的关键字改写要求实现

    改写要求1:将字符数组str改为字符指针p,动态开辟存储空间 改写要求2:增加统计关键字个数的函数void CountKeyWords() 改写要求3: 增加替换函数void FindKeyWords ...