Semantic Grid mit Bootstrap + LESS Mixins ¿WIE?

Question

Twitter Bootstrap-Dokumentation spricht über drei Mixins Grid-Systeme zu generieren:

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

Ich weiß, wie die Seite Setup Bootstrap zu bedienen und weniger ... Aber ich weiß nicht, wie das Rastersystem semantisch zu verwenden. Die Dokumentation sagt, was Mixins zu verwenden sind, aber nicht wie ... ¿Kann jemand veranschaulichen, wie man sie benutzt, um semantische Gitter zu erzeugen? Nur um herauszufinden, oder wie es funktioniert: S

Vielen Dank !!

Answer 1

In navbar.less Bootstrap finden Sie folgende.

Gitter und .CORE verwendet werden, um die .span zu Namespace()

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

In Fällen, in denen Sie behalten möchten „MS3“ etc aus Ihrem HTML Sie sehr gut etwas tun könnte, ähnlich wie:

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

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

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

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

(12) und (6) sind die Anzahl der Spalten, die Ihr Headerelement überspannen soll. Das ist natürlich

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