优秀的WEB前端开发框架:Bootstrap!
其实早就对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!的更多相关文章
- Bootstrap非常简单实用的web前端开发框架
今天无意间用firebug看网站的代码发现了Bootstrap,之前从来没有听说过这个东东,于是对它产生了好奇感,通过百度我了解到了Bootstrap是一款非常简单,强悍,实用,移动设备端优先使用的这 ...
- 国外很有多优秀的HTML5前端开发框架
国外很有多优秀的HTML5前端开发框架 相信大家都耳熟能详:JQuery Mobile,Twitter Bootstrap, Schena Touch, BackBone等等. 同样,也存在很多国内 ...
- (转)国内外优秀的Web前端工程师
1. 国内外优秀的Web前端工程师 寻找Github.微博.知乎等技术社区上比较活跃.影响力大的圈内大神,供大家膜拜! 视野所限,未必全面,欢迎大家推荐.自荐. 排名不分先后,序号只为标记方便. 提供 ...
- 如何成为一名优秀的web前端工程师(前端攻城师)?
程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · 詹姆士 我所遇到的前端程序员分两种:第一种一直在问:如何学习前端?第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀. ...
- 如何成为一名优秀的web前端工程师(转给自己,共勉)
来源:王子墨的博客 程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · 詹姆士 我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到 ...
- 国内5款优秀的WEB前端框架
1. JX(腾讯) 官网地址:http://alloyteam.github.io/JX/#home JX 是一个类似 Google Closure Library 的 Web 前端开发框架,服务于 ...
- 如何成为一名优秀的web前端工程师
我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀.甚至卓越的WEB前端工程师. 何为:前端工程师? 前端工程师 ...
- 【转】如何成为一名优秀的web前端工程师(前端攻城师)?
[转自]http://julying.com/blog/how-to-become-a-good-web-front-end-engineer/ 程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · ...
- 腾讯Web前端开发框架JX(Javascript eXtension tools)
转自:Web前端开发-Web前端工程师 » 腾讯Web前端开发框架JX(Javascript eXtension tools) JX – Javascript eXtension tools 一个类似 ...
随机推荐
- 酷炫字体背景图的实现——神奇的background-clip: text
愉快的时光总是飞快,七天小长假已接近尾声,抓住假期的尾巴,再学个新知识点——css的background-clip: text属性...会不会有种陌生的感觉,毕竟在我们的印象里,background- ...
- Java 实例 - 标签(Label)
Java 实例 Java 中的标签是为循环设计的,是为了在多重循环中方便的使用break 和coutinue . 以下实例当在循环中使用 break 或 continue 循环时跳到指定的标签处: ...
- [转]JavaScript和html5 canvas生成圆形印章
本文转自:http://www.cnblogs.com/dragondean/p/6013529.html 代码: function createSeal(id,company,name){ var ...
- (C++学习)关于CString的一些疑问
#include <iostream> #include <string> #include <afx.h> #include <vector> usi ...
- Redis学习笔记1 -- 单机环境时分布式锁的使用
使用第三方开源组件Jedis实现Redis客户端,且只考虑Redis服务端单机部署的场景. 前言 分布式锁一般有三种实现方式:1. 数据库乐观锁:2. 基于Redis的分布式锁:3. 基于ZooKee ...
- lintcode 刷题记录··
单例模式,用C#实现过单例模式,python区别就是类里边的静态方法写法不一样,python叫类方法,函数之前加@classmethod class Solution: # @return: The ...
- (1-1)line-height的定义和行内框盒子模型
(1-1)line-height的定义和与行内框盒子模型的关系 一.line-height的定义 line-height的定义: 行高,又称为两基线的距离.默认基线对齐(因为CSS所有*线:总之就是各 ...
- 2d动画开发之PIXI开发
简单的移动小游戏只要引入pixi.min.js就可以, 如果要用spine动画(龙骨也支持导出spine格式的)就要引入pixi-spine.js 如果还有声音的支持引入pixi-sound.js 学 ...
- Oracle INSERT ALL 语句介绍
描述 Oracle INSERT ALL 语句用来用一个 INSERT 语句添加多行.该行可以只使用一个SQL命令插入到一个表或多个表. 语法 Oracle INSERT ALL 语法如下: INSE ...
- Java入门到精通——调错篇之Astah Community打开报需要jre1.7运行环境
1.问题概述 Astah Community安装完以后点击运行Astah Community的时候报此应用需要jdk1.7如下图 但是我的电脑在D盘装了jdk1.8了为什么这个软件为什 ...