bootstrap作為乙個非常流行的前端css框架，得到了非常多的應用。一般的使用方法都是直接download bootstrap.css，作為css檔案引入到html的markup中，隨後直接引用其定義的class，這樣的使用模式有個問題：考慮下面的場景，你需要設計乙個login form,在該表單中有乙個button，通常情況下，你在html markup中使用.btn,.btn-primary預置的class。雖然沒有什麼大的問題，但是html本身不具有表意性。如果我們既要使用到bootstrap定義的那些類，又能在html中不要以.btn,.btn-primary來定義button的style，有什麼辦法呢？本文就提供乙個思路，既滿足這個需求，又能順便減少生產的css檔案尺寸。
bootstrap/├── alerts.less
├── badges.less
├── bootstrap.less
├── breadcrumbs.less
├── button-groups.less
├── buttons.less
├── carousel.less
└── ...
2.將上述bootstrap source放到自己的專案中
my-project/└── assets/
└── less
├── bootstrap
└── style.less
3.由於我們打算將bootstrap作為mixin庫，並不打算將所有內容輸出到生產css檔案中，所以可以隨意修改bootstrap原始檔。另外使用import as reference來importbootstrap，其預定義的所有class都作為mixin可以被自己的專案所引用，但是又不會輸出到最終生產檔案中。
4.在style.less中引入bootstrap.less
@import "bootstrap/bootstrap.less"
5.這樣做的好處是我們可以在html markup中，去除所有bootstrp的class，替而代之的是有語義的html class！
比如：通常直接引用bootstrap.css的情況下的markup為：
<div
class
="well well-lg"
>
<
p>if you'd like to get more information, join our mailing list
p>
<
a href
="/sign-up"
class
="btn btn-success"
>sign up now!
a>
div>
// style.less.sign-up }
<
div
class
="sign-up"
>
<
p>if you'd like to get more information, join our mailing list
p>
<
a href
="/sign-up"
>sign up now!
a>
div>
bootloader和bootstrap的區別
bootloader和bootstrap的區別 在 embedded linux primer 上看到的，其實還有一些分歧和不精確的地方，比如bootstrap 和bootstrap loader似乎在pc上還有區別，不過還是不影響理解了 又如redboot redhat embedded debu...
Bootstrap精巧布局
bootstrap提供倆種布局方式 固定 網格 布局和流式 網格 布局。結合上篇文章所討論的柵格系統來說，bootstrap的布局實際上是在柵格外加個容器 container 固定布局加的是固定寬度 width 的容器，流式布局加的是自適應 或叫可變 寬度的容器，這是二者的唯一區別。1.固定布局 下...
全域性樣式 bootstrap
在製作web頁面時，前端人員都習慣為 設定乙個全域性樣式 reset.css 那麼在bootstrap框架中也不例外。bootstrap框架的核心是輕量的css基礎 庫，他並沒有一味的重置樣式，而是注重各瀏覽器基礎表現，降低開發難度。大部分前端人員都具有歸零的思想，但實際你會發現，歸零之後的樣式在開...