自分のブートストラップクラスを別にしますか？

Question

私はブートストラップを使用しています。自分のクラスとは別の行が必要ですか？私がしなければ、例えば、セクションの背景を設定することはできないからです。どのコードが良いですか？

<div class="container"> 
    <nav class="row"></nav> 
    <section class="row"> 
     <div class="col-sm-3"> 
      some text 
     </div> 
    </section> 
</div> 

<div class="container"> 
    <div class="row"> 
     <nav></nav> 
    </div> 
    <div class="row"> 
     <section> 
     <div class="col-sm-3"> 
      some text 
     </div> 
     </section> 
    </div> 
    </div> 

Answer 1

あなたは両方を使用して、あなたが好むようセクションの背景を変更することができます。あなた自身のクラスを追加してCSSを設定するだけです。

nav{ 
 
height:30px !important; 
 
width:100%; 
 
display:block; 
 
background-color: red; 
 
} 
 

 
.containercolor{ 
 
background-color: black; 
 
margin:0px; 
 
} 
 

 
.row{ 
 
margin: 0px !important; 
 
} 
 

 
.sectionrow{ 
 
height: 200px; 
 
} 
 

 
.colcolor{ 
 
background-color: green; 
 
height:100%; 
 
} 
 

 
.sectionrow{ 
 
background-color: blue; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<nav> 
 
</nav> 
 

 
<div class="container-flex containercolor"> 
 
    <div class="row sectionrow"> 
 
     <div class="col-xs-6"> 
 
     </div> 
 
     <div class="col-xs-6 colcolor"> 
 
     </div> 
 
    </div> 
 
</div> 
 

 
<div class="container-flex "> 
 
    <div class="row containercolor"> 
 
     <nav></nav> 
 
    </div> 
 
    <div class="row"> 
 
     <section class="sectionrow"> 
 
     <div class="col-sm-3"> 
 
      some text 
 
     </div> 
 
     </section> 
 
    </div> 
 
</div>