其实早就对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. 【分布式消息队列-MQ】

    http://www.cnblogs.com/itfly8/p/5155983.html

  2. Python学习之环境搭建及模块引用

    这是我学习Python过程积累的经验和踩过的坑,希望学习Python的新手们能尽量避免,以免不必要的时间浪费.今天也是我第一次接触Python. 基础语法看了两个晚上,所以如果没看的朋友们,抽时间先看 ...

  3. JavaScript中解决多浏览器兼容性问题的方案

    一.document.formName.item(”itemName”) 问题 问题说明:IE下,可以使用 document.formName.item(”itemName”) 或 document. ...

  4. Nginx 502错误总结

    http请求流程:一般情况下,提交动态请求的时候,nginx会直接把 请求转交给php-fpm,而php-fpm再分配php-cgi进程来处理相关的请求,之后再依次返回,最后由nginx把结果反馈给客 ...

  5. zoj 3524(拓扑排序+多重背包)（好题）

    http://blog.csdn.net/woshi250hua/article/details/7824773 题目大意:从前有n座山,山里都有一座庙,庙里都有一个老和尚,老和尚专送纪念品,每个纪念 ...

  6. php explode时间分割

    <?php $str = "2017-02-27 13:40:42"; $first=explode(' ',$str); $second=explode('-', $fir ...

  7. Create a soft keyboard

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  8. nginx服务器绑定多个域名、支持pathinfo路由、隐藏index.php入口文件

    这篇文章仅仅是操作,解释说明部分待更新. 1. 修改nginx的配置文件(我的配置文件在/etc/nginx/nginx.conf) [root@xxx ~]# find / -name nginx. ...

  9. js 密码 正则表达式

    1. 代码 function checkPassword(str){ var reg1 = /[!@#$%^&*()_?<>{}]{1}/; var reg2 = /([a-zA- ...

  10. javastscript获取光标位置

    需求是获取某元素的内容,然后将该内容插入到文本框当前的光标位置 (function($) { $.fn.extend({ insertAtCaret: function(myValue) { var ...