Bootstrap 3 grid in less vs in html

實施bootstrap 3網格的最佳做法是什麼？有兩個選項，通過html中的類和更少的mixins。Bootstrap 3 grid in less vs in html

在html和bootstrap.css（這似乎是標準）使用自舉類：

<div class="container"> 
    <div class="row"> 
     <div class="column-md-6 column-xs-8"> 
      <p>test</p> 
     </div> 
     <div class="column-md-6 column-xs-4"> 
      <div class="row"> 
       <div class="column-md-8 column-xs-6"> 
        <p>Another test</p> 
       </div> 
       <div class="column-md-4 column-xs-6"> 
        <p>Yet another test</p> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

使用更少和引導混入和適當的HTML結構：

<div id="maincontent"> 
    <div id="maincontentarea"> 
     <div id="blogarticles"> 
      <p>test</p> 
     </div> 
     <div id="whatsnew"> 
      <div id="whatsnewarea"> 
      <div id="whatsnewheading"> 
       <p>Another test</p> 
      <div> 
      <div id="whatsnewlist"> 
       <p>Yet another test</p></div> 
      <div> 
      </div> 
     </div> 
    </div> 
<div>

和相應的LESS：

#maincontent{ 
    .container(); 
    #maincontentarea{ 
     .make-row(); 
     #blogarticles{ 
     .make-md-column(6); 
     .make-xs-column(8); 
     } 
     #whatsnew{ 
     .make-md-column(6); 
     .make-xs-column(4); 
     #whatsnewarea{ 
      .make-row(); 
      #whatsnewheading{ 
       .make-md-column(8); 
      } 
      #whatsnewlist{ 
       .make-xs-column(6); 
      } 
     } 
     } 
    } 
}

這聽起來像是一個不錯的想法，只需使用引導混合來定義結構，而不是使用LESS文件中已經定義的less文件中的元素結構。哪一個更容易維護？

來源

2013-12-13 toksing

你的HTML的第二塊是有點奇怪。雖然它看起來第一眼看起來好像你有一個div結束標記太多（在另一個測試段落之後），你真的有比結束標記更多的開始標記。 –