Css 语义网格与Bootstrap+;更少的混合物和xBF;怎样?

Css 语义网格与Bootstrap+;更少的混合物和xBF;怎样?,css,twitter,twitter-bootstrap,less,mixins,Css,Twitter,Twitter Bootstrap,Less,Mixins,Twitter引导文档介绍了生成网格系统的三种混合方式: .container-fixed(); #grid > .core(); #grid > .fluid(); 我知道如何设置页面使用引导和更少。。。但我不知道如何在语义上使用网格系统。文档说明了要使用哪些mixin,但没有说明如何。。。有人能举例说明如何使用它们来创建语义网格吗?只是想弄清楚或看看它是如何工作的:S 谢谢 在navbar.less引导中,您将发现以下内容 grid和.core用于命名.span()的名称空间

Twitter引导文档介绍了生成网格系统的三种混合方式:

.container-fixed();
#grid > .core();
#grid > .fluid();
我知道如何设置页面使用引导和更少。。。但我不知道如何在语义上使用网格系统。文档说明了要使用哪些mixin,但没有说明如何。。。有人能举例说明如何使用它们来创建语义网格吗?只是想弄清楚或看看它是如何工作的:S


谢谢

在navbar.less引导中,您将发现以下内容

grid和.core用于命名.span()的名称空间 如果您想在html中保留“span3”等内容,您可以执行类似的操作:

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>


这对我来说很有效:[另一个Stackoverflow答案][1][1]:所以这基本上是在做你该做的事情-但好处是让你选择你做的方式
<header class="span12"></header>
<article class="span6"></article>
<aside class="span6"></aside>
<footer class="span12"></footer>