ブートストラップ - 行と列を使用する必要がありますか？

Question

は私が2例で説明しましょう：

<div class="row"> 
    <h1>Title</h1> 
    <div class="col-md-12">Content</div> 
</div> 

<div class="row"> 
    <div class="col-md-12"><h1>Title</h1></div> 
</div> 
<div class="row"> 
    <div class="col-md-12">Content</div> 
</div> 

対の例は、過度に単純化されているが、私の質問は、彼らが外に座ることができることはすべてが、列またはどこに必要な範囲内でなければならないんです？別の例：

<div class="row"> 
    <div class="col-md-6 col-sm-6"> 
    <img src="img/Police2-600x250.jpg" class="full-width"> 
     <div class="col-md-12 news"> 
     <p class="date">POSTED <strong>01 APRIL</strong></p> 
     <h3>Heading</h3> 
     <p>This is a summary of what the story is about like a subheading to catch your attention. Blah blah blah b l a h blah blah.</p> 
     </div> 
    </div> 
    <div class="col-md-6 col-sm-6"> 
     <img src="img/Police2-600x250.jpg" class="full-width"> 
     <div class="col-md-12 news"> 
      <p class="date">POSTED <strong>01 APRIL</strong></p> 
      <h3>Heading</h3> 
      <p>This is a summary of what the story is about like a subheading to catch your attention. Blah blah blah b l a h blah blah.</p> 
     </div> 
    </div> 
</div> 

私は画像を任意のパディングの対象にしたくないが、私は

Answer 1

にそれ以下のコンテンツをしたいです彼ら列の外に座って、これをやってですることができますあなたは詰め物を犠牲にしている。ブートストラップの.rowスタイルセットはmargin-leftとmargin-right〜-15pxです。 .col-...クラスはこれを補完し、どちらの側でも15pxのパディングを行います。

これを補うには、この15pxのパッドを手作業で非.col-...要素に追加する必要があります。

<div class="row"> 
    <h1 class="col-md-12">Title</h1> 
    <div class="col-md-12">Content</div> 
</div> 

Answer 2

あなたはブートストラップのグリッドを使用したい場合は、はい、列がの直接の子である必要があります。しかし、あなたのh1は.col-...自体でことができない理由はありません、と述べた

列に配置する必要があります。ブートストラップドキュメントから...

http://getbootstrap.com/css/#grid-intro

コンテンツは、列内に配置されなければならない、そして唯一の列は、行の 直下の子かもしれません。