本文在于巩固基础

学习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. Java程序员面试题集(71-85)(转)

    转:http://blog.csdn.net/jackfrued/article/details/17566627 Java程序员面试题集(71-85) 摘要:这一部分主要包括了UML(统一建模语言) ...

  2. Android学习总结——SharedPreferences

    SharePreferences存储方式,只是轻量级数据存储,xml格式的数据显示方式.简单存储步骤如下:一:获取SharePreferences对象1.SharedPreferences pref ...

  3. H5实现图片优化上传

    一,HTML部分 <input type="file" accept="images/*"> <input class="url&q ...

  4. C++类构造函数

    一.概述 类是一种用户自定义的类型,声明一个类对象时,编译程序要为对象分配存储空间,进行必要的初始化.在C++中,这项工作是由构造函数来完成的. 大部分对象在使用之前没有正确的初始化是C++出错的主要 ...

  5. C# 单例模式(转)

    C#设计模式学习笔记-单例模式 最近在学设计模式,学到创建型模式的时候,碰到单例模式(或叫单件模式),现在整理一下笔记. 在<Design Patterns:Elements of Resuab ...

  6. Oracle创建数据库、表、用户

    create tablespace south_knowledge logging datafile 'D:\TestDatabase\south_knowledge.dbf' size 10m au ...

  7. oracle 11g R2安装报错ORA-00604及ORA-06553的原因及解决方法

    10月31日PO主打算装oracle 11g R2,于是通过QQ旋风离线下载功能从oracle官网的链接下载了win32_11gR2_database_1of2.zip和win32_11gR2_dat ...

  8. 实现一个宽和高都是100像素的div可以用鼠标拖拽移动的效果

    html,body{ width:100%;height:100%;margin:0px;padding:0px; } #box{ width:100px;height:100px;backgroun ...

  9. Kill命令模拟1

    #include<sys/types.h> #include<signal.h> #include<stdio.h> #include<stdlib.h> ...

  10. jquery easyui form load

    加载数据后如果有其他操作可以这样写: $(function () { //如果加载远程json数据后还需要有其他操作, 可以这样写 $.getJSON('GetHandler.ashx?xmbh=&l ...