帶有Bootstrap + LESS Mixins的語義網格➤如何？

Question

Twitter的引導文件會談約三混入生成網格系統：

.container-fixed(); 
#grid > .core(); 
#grid > .fluid(); 

我知道如何設置的頁面使用引導，少...但我不知道如何使用語義網格系統。文檔說明了什麼是混合使用，但不是如何......任何人都可以如何使用它們來創建語義網格？只是爲了弄清楚或者看看它是如何工作的：S

謝謝!!

Answer 1

在引導的navbar.less你會發現下面。

電網和。核心是用來命名空間中的.span（）

.navbar-fixed-top .container, 
.navbar-fixed-bottom .container { 
#grid > .core > .span(@gridColumns); 
} 

在你想保留「span3」等你的HTML，你很可能會做同樣的事情到的情況：

header { 
    #grid > .core .span(12) 
} 

article.right { 
    #grid > .core .span(6) 
} 

aside.right { 
    #grid > .core .span(6) 
} 

footer { 
    #grid > .core .span(12) 
} 

（12）和（6）你想你的頭元素跨越的列數。這當然是更換

<header class="span12"></header> 
<article class="span6"></article> 
<aside class="span6"></aside> 
<footer class="span12"></footer>