bootstrap学习——自定义bootstrap

定制的bootstrap：【http://www.w3cplus.com/css/customizing-bootstrap.html】

留意以下这些文件：

bootstrap.less:

这个是核心文件。它用来引入其他文件，最终由你来编译它。

reset.less:

始终是最先引入的文件。

variables.less 和 mixins.less:

这两个文件总是同时出现，因为其他文件都依赖于它们。前一个文件包含了在生成器网站上使用的相同的变量。

utilities.less

这个文件总是最后引入，你可以把想要覆盖的类写到这里。

当安装结束后，你可以这样来编译bootstrap.less：

lessc bootstrap.less > bootstrap.css	

如果想编译压缩版本，使用这个命令：

lessc --compress bootstrap.less > bootstrap.min.css	

无论你使用哪种方式编译，编译的目标只能是bootstrap.less，而并非其他任何文件。

模块化你的修改

你可能注意到了上面方法的缺陷。那就是你修改的内容与原始文件纠缠在了一起。结果当Bootstrap不可避免的因为修复bug或增加新功能而进行升级时，你根本不可能将自定义的内容更新到新的版本上。

为了避免出现这个问题，你需要模块化你的修改。这是我为Bootswatch制作主题时的采取的方法。

首先，我下载了Bootstrap的源代码，把它的名字修改为bootstrap后原封不动的放好。我并没有对它包含的文件进行任何修改，而是新创建了一个单独的文件夹，取名为custom，含有如下三个文件：

custom-variables.less:

我从Bootstrap源码中复制了一份variables.less并在这份拷贝中修改变量。

custom-other.less:

这个文件中包含了那些无法定义成变量的自定义内容。

custom-bootstrap.less

这是新的「核心」文件。我们将把它编译成CSS。与原始的 LESS文件一样，它使用下面的命令来引入上面那两个自定义文件：

@import "../bootstrap/less/bootstrap.less";
@import "custom-variables.less";
@import "custom-other.less";
@import "../bootstrap/less/utilities.less";	

修改内容被分隔开后，你可以很轻松的升级到Bootstrap的新版本。只需要将旧bootstrap文件夹替换，再重新编译即可。

我为这种方法创建了一个叫做swatchmaker的样板文件。它还包含了其他内容，例如测试页面和更新Bootstrap到最新版的命令，当修改被保存时执行自动编译，还可以重置你自定义的内容。

兼容ie7和其以前的ie版本：

可以考虑把Blueprint和Bootstrap融合

要DIY用960grid或者Blueprint吧，
实在要用，可以考虑：
1.html5boillerplate -> http://html5boilerplate.com/ 
2.foundation -> http://foundation.zurb.com/
3.skelon -> http://getskeleton.com/

用compass不要用bootstrap, 用css3PIE让ie6-8支持部分css3

 

 

----------------------------------------------------------杂项

这个下拉菜单有较大局限性。不如自己写的。bootstrap本质上就是媒体查询定制不同样式，除此外没啥东东。

BootStrap入门教程 (一)

 Bootstrap编译与扩展【linux】

 

最好的 Bootstrap UI 编辑器集合

 

30 个惊艳的 Bootstrap 扩展插件

http://www.oschina.net/news/43645/30-amazing-plugins-extend-twitter-bootstrap

 

 

bootstrap的学习心得

http://www.open-open.com/lib/view/open1366529702484.html

 

相关资讯 　—　更多 最新最好的免费Bootstrap主题 最好的 Bootstrap UI 编辑器集合 最全的 Twitter Bootstrap 开发资源清单 扩展 Twitter Bootstrap 的JavaScript插件 免费的Bootstrap网站模版 - Bootstrapper 25个强大、实用的Bootstrap工具和生成器 免费的响应式Bootstrap模板 - Codester Bootstrap 2.2.2 的新特性介绍 如何简单快速的修改Bootstrap 13 个酷和帅气的 Bootstrap 主题免费下载 推荐12款优秀的 Twitter Bootstrap 组件和工具 8 个必看的 Bootstrap 的 WordPress 框架 Jetstrap：Bootstrap的可视化制作工具 基于Bootstrap的界面拖放生成器：LayoutIt! Twitter 的前端 UI 框架，Bootstrap 2.3.0 发布 基于Bootstrap的最好电子商务模板 12个最好的Bootstrap设计工具 30个惊人的插件来扩展 Twitter Bootstrap Bootstrap 项目博览会 10个最好的 Bootstrap UI 编辑器

相关文档 　—　更多 bootstrap入门教程.doc bootstrap入门教程.pdf Bootstrap 入门教程.doc O'REILLY Bootstrap - Responsive Web Development.pdf Bootstrap Responsive Web Development.pdf linux操作系统的启动过程.pdf ClassLoader 加载机制.pdf Tomcat6启动过程分析.doc JVM（Java虚拟机）ClassLoader学习文档.doc JeeSite 开发手册.docx Tomcat源码研究.pdf Extjs4 分享手册.pptx [数理统计与数据分析].(Mathematical.Statistics.and.Data.Analysis,.3ed).pdf AJAX+DWR 的学习心得.doc Hadoop 的一周学习心得.doc Java设计与模式学习心得笔记.pdf javacc 学习心得.pdf javacc学习心得.doc RESTlet 学习心得.docx Watir学习心得分享.ppt