什麼是Twitter的引導混入命名約定

在Twitter的引導混入：https://github.com/twitter/bootstrap/blob/master/less/mixins.less 什麼是Twitter的引導混入命名約定

有混入由破折號和駝峯命名： .buttonBackground 。輸入的塊級

在3.0.0- wip分支我們也有下劃線： clear_float

我的問題是什麼是mixin命名約定？謝謝！

2013-02-26 xnjiang

Bootstrap默認使用較少。你正在使用變量和混入混淆（可以理解爲函數）

所以駱駝與變量一樣使用：

@color: #333; 

    #nav { 
    color: @color; 
    }

@color這裏是一個變量。

現在mixins允許我們通過簡單引用其中的類名將類的所有屬性添加到另一個類中。例如：

.center-block() { 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    }

我們可以在上面直接使用類center-block成我們希望有相同屬性的新類。即：

#nav > li > a{ 
     .center-block;

}

的混入簡單類中聲明，並且可以在任何地方使用。因此，它們的命名約定是我們在css中聲明其他類的常規方式。

但是，如果你只是想區分mixin和其他類...你可以有一個特定的寫作方式......像第一個字母作爲首都..你知道只是對你有用的東西。

來源

2013-02-26 10:02:22 Shail

感謝您的回覆！那麼，在twitter bootstrap mixin命名中沒有這樣的「最佳實踐」？例如，在ruby中，我們使用下劃線編寫所有的方法：this_is_a_method;使用camelCase編寫類：ThisIsAClass。 – xnjiang 2013-02-27 09:08:13

請參閱bootstrap是一個框架，它不是一種語言。所以它使用CSS提供的約定，如果你潛入的更少。公約基本上是他們的。所以在css中編寫好代碼的最佳實踐也意味着引導。而在CSS破折號廣泛用於創建類似圓角，明確的浮動。未使用下劃線。在更少的@是變量和mixin是類，所以你可以聲明他們像普通的CSS類或創建一個簡單的自己的區分方法。 – Shail 2013-02-27 09:12:16

謝謝，非常有幫助。但爲什麼bootstrap人不會堅守一個慣例：衝刺mixin？ – xnjiang 2013-02-27 14:47:05

什麼是Twitter的引導混入命名約定

回答

相關問題