其实早就对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. SEO 小技巧汇总

    一.为了提高搜索点击率,还可以   1.为了增加关键词的密度,将关键字隐藏在页面里(将文字颜色定义成与背景颜色一样). 2.在图象的alt注释语句中加入关键字. 如:<IMG SRC=" ...

  2. 通过mysql自动同步redis

    在服务端开发过程中,一般会使用MySQL等关系型数据库作为最终的存储引擎,Redis其实也可以作为一种键值对型的数据库,但在一些实际场景中,特别是关系型结构并不适合使用Redis直接作为数据库.这俩家 ...

  3. JavaEE之JavaWeb核心之Servlet

    Servlet简介: Servlet 运行在服务端的Java小程序,是sun公司提供一套规范(接口),用来处理客户端请求.响应给浏览器的动态资源.但servlet的实质就是java代码,通过java的 ...

  4. cf1043C. Smallest Word(贪心)

    题意 题目链接 Sol 这题打cf的时候真的是脑残,自己造了个abcdad的数据开心的玩了半天一脸懵逼...最后还好ycr大佬给了个思路不然就凉透了... 首先不难看出我们最后一定可以把字符串弄成\( ...

  5. vue.js与angular.js的区别（个人）

    刚进入实训 讲师就要发一些什么比较高大上的东西,本人才疏学浅  浅浅的分享一下angularjs 和vue.js的区别.只是简单的理解一下 大神勿喷. 生实训之前学习的angular.js 只是理解了 ...

  6. 基础架构之Redis

    项目开发过程中,有些信息的变动频率是很低但又经常访问到,这些信息我们往往放在缓存中,目前在缓存组件中,Redis绝对值得你列入使用计划.更多详细信息可以参考官网 https://redis.io/.这 ...

  7. SpringBoot中Mybaties PageHelper插件使用

    首先引入pom.xml文件配置  <!-- mybatis --> <dependency>  <groupId>org.mybatis.spring.boot&l ...

  8. android popupwindow位置显示

    1.在控件的上方: private void showPopUp(View v) { LinearLayout layout = new LinearLayout(this); layout.setB ...

  9. hack (浏览器兼容css hack）

    1.hack的原理 由于不同的浏览器对CSS的支持及解析结果不一样,还由于CSS中的优先级的关系.我们就可以根据这个来针对不同的浏览器来写不同的CSS. CSS Hack大致有3种表现形式,CSS类内 ...

  10. Maven 安装与使用（一）

    1. 安装 参考:http://maven.apache.org/install.html A. win7环境下,官网下载maven安装文件 B. 解压缩maven文件 C. 确认已配置好JAVA环境 ...