BootStrap学习从现在开始
前言
原文链接 http://aehyok.com/Blog/Detail/6.html
当下最流行的前端开发框架Bootstrap,可大大简化网站开发过程,从而深受广大开发者的喜欢。本文总结了Bootstrap之所以广泛流传的11大原因。如果你还没有使用Twitter Bootstrap,建议你去了解一下。我也是最近才有所发现的,不过有更好的消息,在前两天微软发布的VS2013正式版中,也已经将BootStrap3.0的版本加入了额,连微软都看到bootStrap的强大,而且它的确很不错,所以我也不得不学习。这里有我对VS2013更新的简要介绍,有兴趣的话你可以看一眼Visual Studio 2013更新内容简介
bootstrap深受广大屌丝喜爱的原因到底是什么呢
1.节省时间
利用Bootstrap,你将有更多的时间用来挣钱。Bootstrap库中包含很多现成的代码片段,这些代码可为你的网站增加更多活力。Web开发者不必再花费时间、费力地编码,只需找到合适的代码,插入到合适位置即可。此外,CSS利用LESS编写,很多样式和设计都已设计完成。
2.定制化
Bootstrap很重要的一方面就是你可以将它据为己有。你可以留取框架中需要的部分,抛弃不需要的。Bootstrap整体允许你根据自己的需要,裁剪自己开发的项目。
3.设计方面的因素
网格系统
对页面进行布局时,往往需要有一个合适的网格。你不一定使用该平台的网格,但它确实能大大降低你工作的难度。默认模式下,该平台提供一个16列的网格(宽为960px)。每列宽40px,每列左右两侧具有10px的间隙,各网格最外侧均留出20px的空白。你可以根据需要改变行数与间隔大小。样式已开发完成,开发者只需要把合适的代码放入HTML合适的位置即可。
LESS
LESS在开发周期内应用很广。它是一种基于CSS之上的高级语言,其目的是使得CSS开发更灵活和更强大。你可以利用LESS的Mixins及CSS操作定制内嵌网格。Bootstrap采用了大量流行的CSS3功能,可以对所有的网站提供统一的浏览体验。
JavaScript
Bootstrap提供JavaScript库,该库超越了基本的架构与样式。通过Bootstrap,开发者可轻易地操作窗口警告框、工具提示框、滚动条、按钮等。Bootstrap最突出之处是,它可以让你不必再费神费力地写脚本。
4.一致性
Twitter当初开发该工具的最主要原因是,开发者所开发项目在不同浏览器间的不一致性。这就导致了很多前端开发与最终用户界面之间的问题。Bootstrap保证了界面在不同平台上的统一性。在IE、Chrome及Firefox中,你可以看到统一的界面。
5.保持持续更新
以jQuery 的UI为例:每一年更新一次。而Bootstrap则在不停地改进,更具规律性与持续性。Web开发者一发现新问题, Bootstrap团队便立刻着手修复它。
6.易于集成
如果你想进一步完善一个已完成的网站,Bootstrap可以帮助你。例如,如果你要统一使用自己编写的表格样式,你要做的是把你的样式复制到CSS样式文件中。Bootstrap将立即剔除它本身的样式,在这里,你需要将该文件与Twitter进行关联。集成的过程十分简单、方便、快捷。完成之后,你便可以把你的设计应用到你的核心内容上。
7.响应式
Bootstrap为响应式框架。无论你的开发工作从笔记本转移到iPad,还是从iPad转移到Mac上,你都不用为你的工作而苦恼。因为Bootstrap能以超快的速递与效率适应不同平台间的差异。
8.对未来技术具有兼容性
Bootstrap包含很多特殊元素,如HTML5和CSS3,这些元素被称为设计的未来。因为该框架考虑到设计和开发的未来,它很有潜力成为未来几年里Web开发者的参考标准。
9.竞争力
Bootstrap并不是唯一的前端开发框架,比如还有JQuery UI、HTML5 Boilerplate等等。但对于Bootstrap来说,真正的竞争对手是Zurb Foundation。Bootstrap 2新增加了一个工具集,Foundation经过好长时间才填补上。Bootstrap包含大量的第三方插件、主题、功能特性、代码等等,而Foundation并不具备这些。
10.详尽的说明文档
Bootstrap的文档相当精彩。大部分新平台往往没有合适的说明文档,而Bootstrap的说明文档大大帮助了我们的入门学习。通过文档可以找到我们需要的所有信息。
11.让老板们受益
学习Bootstrap,并不会花费你太多时间,因为它将所有的模块化方法与体系结构封装在了一起。从老板的角度来看,如果你为Web开发者提供了Bootstrap框架,那么他们会节省更多的学习时间,并快速投入到工作中。这会为老板们带来更好的收益。
如果你觉得Bootstrap确实对你有帮助,你可以访问twitter.github.com/bootstrap/查看该框架。你也可以下载编译版本,或获取包含CSS和JavaScript文档的Bootstrap源文件。
视觉体验
首先看到的这是中文官网,如果细心看一下,其实它的讲解很详细。
接下来点进http://v3.bootcss.com/bootstrap3中文文档。
继续往下看http://expo.bootcss.com/这里许多已经应用的网站实例额。
看到这么多实例,这么优秀的前端架构,我竟然才知道,而且有这么多的网站已经使用了,我也迫不及待了,开始我的学习之旅了。
总结
看了这么多,没什么好说的了,接下来就是要学习了,初步打算使用DreamWeaver6进行简单的学习练习。
BootStrap学习从现在开始的更多相关文章
- Bootstrap~学习笔记索引
回到占占推荐博客索引 bootstrap已经用了有段时间了,感觉在使用上还是比较容易接受的,在开发人员用起来上,也还好,不用考虑它的兼容性,手机,平台,PC都可以有效的兼容. bootstrap官方a ...
- Bootstrap学习(3)
Bootstrap 图片 Bootstrap 对图片的支持.Bootstrap 提供了三个可对图片应用简单样式的 class: .img-rounded:添加 border-radius:6px 来 ...
- BootStrap学习(2)
使用Bootstrap添加代码框 可先看:简介.引入.包下载等:http://www.cnblogs.com/0201zcr/p/4900062.html Bootstrap 允许您以两种方式显示代码 ...
- Bootstrap 学习(1)
简介 Bootstrap,来自 Twitter,是目前最受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷. Bootst ...
- 前端框架——BootStrap学习
BootStrap简单总结下:1.栅格系统,能够很好的同时适应手机端和PC端(及传说中的响应式布局) 2.兼容性好 接下来是对BootStrap学习的一些基础案例总结和回顾: 首先引入:bootstr ...
- bootstrap学习总结-css样式设计(一)
由于项目需要,所以打算好好学习下bootstrap框架,之前了解一点,框架总体不难,但涉及到的东西还是很多,想要熟练掌握它,还是要多练练. 一:bootstrap是什么? bs是什么? 即前端页面搭 ...
- Bootstrap学习笔记(二) 表单
在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...
- BootStrap学习之先导篇——响应式网页
Bootstrap学习之前,要知道响应式网页的原理. 1.什么是响应式网页? 一个页面,可以根据浏览设备的不同,以及特性的不同,而自动改变布局.大小等.使得在不同的设备上上都可以呈现优秀的界面. 优点 ...
- bootstrap学习笔记之为导航条添加标题、二级菜单及状态 http://www.imooc.com/code/3120
为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过" ...
- bootstrap学习笔记之基础导航条 http://www.imooc.com/code/3111
基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...
随机推荐
- poj2386(简单的dfs/bfs)
题目链接:http://poj.org/problem?id=2386 Description Due to recent rains, water has pooled in various pla ...
- Java -- JDBC 学习--PreparedStatement
可以通过调用 Connection 对象的 preparedStatement() 方法获取 PreparedStatement 对象.PreparedStatement 接口是 Statement ...
- 「loj3057」「hnoi2019」校园旅行
题目 一个n个点m条边的无向图,每个点有0 / 1 的标号; 有q个询问,每次询问(u,v)直接是否存在回文路径(可以经过重复的点和边); $1 \le n \le 5 \times 10^3 , ...
- NOIP2018普及组模拟赛
向老师给的模拟赛,还没普及组难... 题目在洛谷团队里. 第一试三道水题,我46分钟就打完了,然后就AK了. 第二试一看,除了第二题要思考一段时间之外,还是比较水的,但是我得了Rank倒1,115分. ...
- Codeforces Round #517 (Div. 2, based on Technocup 2019 Elimination Round 2) D. Minimum path
http://codeforces.com/contest/1072/problem/D bfs 走1步的最佳状态 -> 走2步的最佳状态 -> …… #include <bits/ ...
- quartz简单定时任务【可以处理完一个任务才开启下一个线程】【我】
maven jar project项目一个 pom文件: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:x ...
- NO.7:别让异常逃离析构函数
1.析构函数绝对不要吐出异常,如果一个析构函数可能抛出异常,析构函数应该捕获任何异常,然后要么吞下它们或者退出程序 2.如果用户需要对析构内的可能抛出异常的操作做出反应,则应该将操作放入除析构函数外的 ...
- java代码示例(6-3)
创建AdministratorTest.java /** * 需求分析:创建管理员对象 * @author chenyanlong * 日期:2017/10/15 */ package com.hp. ...
- django 403问题
C:\Users\x\pyp1>python manage.py runserverPerforming system checks... System check identified no ...
- python中迭代器和生成器的区别
#!/usr/bin/python def power(values): for value in values: print "powing %s" % value yield ...