东逝水

最近重温Bootstrap，想把它吃透！就从头开始学习，从github上下载源码，按照其中readme.md文件中的方法把源码中docs部署在本地。期间遇到了点问题，这里记录一下。按照readme.md中的说法，他们使用的是jekyll这个东东来host的。为了使用这个玩意儿，本地要有ruby环境。关于这一点readme.md中说的很详细，并没有出现问题，原文如下：1. If ne

Bootstrap使用well给元素插入的效果，在视觉上 好像是嵌入进去的。 来看下它的样式代码：//// Wells// --------------------------------------------------// Base class.well { min-height: 20px; padding: 19px; margin-bottom: 20px; b

本文内容： - 下载Bootstrap源代码 - 熟悉目录结构 - 创建自己的空项目 - 摘录Bootstrap源码中grunt的less编译代码下载Bootstrap源代码开源的，托管在github上。那就去github上去下载呗！git clone https://github.com/twbs/bootstrap.git熟悉目录结构来自Bootstrap官网bootstrap/├──

首次接触Bootstrap是在13年了吧。这期间断断续续地使用它，虽然也曾看过它的源码，但是每次都是因为不想翻看CSS，而只是去看JS那部分。因此Bootstrap虽然常在手边，虽然会用，但是却不能吸取好的框架的思想和其中使用的技术。这是一种暴殄天物的行为。而今迈步从头越！！ 同样让我追悔的是，我在08年就接触CSS了，也同样开始接触jQuery。但是没有形成一个好的习惯，没能及时总结，导致时至如

真的很纠结，怎么去介绍Bootstrap中的mixins呢？在不熟悉Bootstrap之前去说mixins没有必要，为啥呢？其中有好多mixins是跟它特定的dom结构有关系的，比如下面的alerts.less// Alerts.alert-variant(@background; @border; @text-color) { background-color: @background;

粘贴代码又开始了！forms.less// Form validation states//// Used in forms.less to generate the form validation CSS for warnings, errors,// and successes..form-control-validation(@text-color: #555; @border-colo

突然觉得先从mixins开始好无聊，先占位吧，等用到了再回来补充。。。hide-text.less占位image.less占位labels.less占位list-group.less占位nav-divider.less占位nav-vertical-align.less占位opacity.less占位pagination.less占位panels.less占位progress-bar.less占位re

Bootstrap中变量文件竟然有八九百行，这是要看疯我吧。其实去除注释和空行，估计剩下来也就一半了。其中无非是一些颜色值，padding值等等。有全局通用的，也有针对某个component的。这样分开来看，其实也不是很多，只是一下子看到这么多还是有点怕怕的。 这个文件要熟悉还得多看几遍，看多了自然就熟了！如果想改改Bootstrap默认的主题，可以修改这里面的颜色值，选择自己的风格。当然了实际中

之前文章中搭建了编译Bootstrap中Less文件的环境。但是项目是空的，并没有代码。现在开始终于要一步一步把Bootstrap的Less拷贝到我们自己的项目中了。 首先，先把源码中的bootstrap.less文件拷贝到我们自己项目中的bootstrap.less文件中，并且都注释起来。 然后，把源码中的mixins都拷贝到我们的项目里。 之后，再把variables.less也拷贝过来。