其实早就对Bootstrap有所耳闻，大概了解这哥们是做WEB前端的

但直到昨天以前，还没有对他产生任何深入了解的兴趣

冷落他的主要原因还是觉得会束缚手脚，毕竟自己多年来在WEB前端的积累一直没有停滞，在这方面还没有感受到多少压力，换句话说，觉得自己还是有点倚仗的

就在昨天，一个好哥们请我帮忙给做个他们内部用的小网站，要求用电脑和手机都可以正常使用

电脑用当然OK，不过要兼容手机却让我有点小兴奋，毕竟以前还没有做过真正的手机端WEB应用，正好借这个机会锻炼一下

由于是独立的网站，可以完全放开手脚弄点新鲜的，当时就想起了Bootstrap，他的响应式特性还是给我留下了很深的印象

接着就按照Bootstrap文档做了一个Nav导航效果，看着不错，反色效果，很酷：

然后，调整浏览器的宽度，变小一些，模拟手机端的效果：

果然发生了变化，而且效果超好，这就是响应式布局的手段吗

导航菜单由原来的水平平铺变成了垂直下拉，点击右上角的按钮可以控制下拉菜单进行显隐

就是这个初步的体验，就觉得非常有必要对Bootstrap进行认真的、深入的了解和学习

把关于Bootstrap相关的几个地址保留一下，这些都是进入Bootstrap世界的钥匙：

1、Bootstrap中文网：http://www.bootcss.com

2、Bootstrap v3 中文文档：http://v3.bootcss.com

3、w3cschool上的Bootstrap入门教程：http://www.w3cschool.cc/bootstrap/bootstrap-tutorial.html

4、aehyok老兄写的Bootstrap学习笔记：http://www.cnblogs.com/aehyok/p/3381651.html

优秀的WEB前端开发框架：Bootstrap！的更多相关文章

  1. Bootstrap非常简单实用的web前端开发框架

    今天无意间用firebug看网站的代码发现了Bootstrap,之前从来没有听说过这个东东,于是对它产生了好奇感,通过百度我了解到了Bootstrap是一款非常简单,强悍,实用,移动设备端优先使用的这 ...

  2. 国外很有多优秀的HTML5前端开发框架

    国外很有多优秀的HTML5前端开发框架 相信大家都耳熟能详:JQuery Mobile,Twitter Bootstrap, Schena Touch,  BackBone等等. 同样,也存在很多国内 ...

  3. （转）国内外优秀的Web前端工程师

    1. 国内外优秀的Web前端工程师 寻找Github.微博.知乎等技术社区上比较活跃.影响力大的圈内大神,供大家膜拜! 视野所限,未必全面,欢迎大家推荐.自荐. 排名不分先后,序号只为标记方便. 提供 ...

  4. 如何成为一名优秀的web前端工程师（前端攻城师）？

    程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · 詹姆士 我所遇到的前端程序员分两种:第一种一直在问:如何学习前端?第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀. ...

  5. 如何成为一名优秀的web前端工程师（转给自己，共勉）

    来源:王子墨的博客 程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · 詹姆士 我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到 ...

  6. 国内5款优秀的WEB前端框架

    1. JX(腾讯) 官网地址:http://alloyteam.github.io/JX/#home JX 是一个类似 Google Closure Library 的 Web 前端开发框架,服务于 ...

  7. 如何成为一名优秀的web前端工程师

    我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀.甚至卓越的WEB前端工程师. 何为:前端工程师? 前端工程师 ...

  8. 【转】如何成为一名优秀的web前端工程师（前端攻城师）？

    [转自]http://julying.com/blog/how-to-become-a-good-web-front-end-engineer/ 程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · ...

  9. 腾讯Web前端开发框架JX(Javascript eXtension tools)

    转自:Web前端开发-Web前端工程师 » 腾讯Web前端开发框架JX(Javascript eXtension tools) JX – Javascript eXtension tools 一个类似 ...

随机推荐

  1. 使用webgl(three.js)创建3D机房(升级版)-普通机房

    序: 目前市面上的数据中心主要分两大类,一类属于普通数据中心,机柜按照XY轴 有序排放,一类属于微模块集合的数据中心,多个机柜组合而成的微模块.  本节课主要详细讲解普通数据中心的可视化展示,浏览器直 ...

  2. angular 之 jquery-autocomplete

    自动完成还是原来的 bassistance.de 好用,详细用法参考官网. angular的js paths配置及依赖关系不多说: 'jquery': 'static/jquery-1.11.3/jq ...

  3. ServiceHelper

    public class ServiceHelper { private static string _baseUrl = $@"http://{Config.Instance.MesSer ...

  4. C#实现Javascript的Splice方法

    最近开始学习Javascript语言,看到splice方法,以下引用其说明:该方法是一个通用删除和插入元素的方法,它可以在数组指定的位置开始删除或插入元素.其包括3个参数:第一个参数指定插入的起始位置 ...

  5. vue本地设置请求接口及数据

    1.安装axios yarn add axios 2.在入口文件main.js中设置 import { getRequest, postRequest} from './libs/api';//导入 ...

  6. js打印去掉页眉页脚

    <style type="text/css" media="print"> @page /* 实现代码 */ { size: auto; /* au ...

  7. Incorrect column count: expected 1, actual 5

    在使用jdbc的querForObject queryForList的时候,出现Incorrect column count: expected 1, actual 5 比如 String sql = ...

  8. thinkphp 手机号和用户名同时登录

    //在注册时用户名不能是纯数字, 防止一个人的用户名和另一个人的手机号相同public function Login(){ if (IS_AJAX) { $username = I('param.us ...

  9. Intellij IDEA快捷键大全汇总

    Alt+回车 导入包,自动修正 Ctrl+N   查找类 Ctrl+Shift+N 查找文件 Ctrl+Alt+L  格式化代码 Ctrl+Alt+O 优化导入的类和包 Alt+Insert 生成代码 ...

  10. GEOS编译

    GEOS是开源的空间运算引擎,最近用到,在这里记录下. 目录 GEOS简介 GEOS编译 一.GEOS简介 GEOS(几何引擎 - 开源)是一个具有完整空间查询和分析功能的C++库.它包括所有Open ...