如何在相同的div標籤下獨立設計一組元素？

如何在下列HTML代碼中獨立設置樣式的數字？如何在相同的div標籤下獨立設計一組元素？

<div class="info-down"> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-xs-4">24</div> 
      <div class="col-xs-4">07</div> 
      <div class="col-xs-4">15</div> 
     </div> 
    </div> 
    </div>

來源

2015-06-24 e-ba' e

嘗試將它們放在span中，然後添加類來跨度和編輯css。 –

或者使用nth-child（）僞類來選擇你的.row元素的所需的孩子.col -... – dajnz

@dajnz謝謝:) –

好了，你有兩個選擇。您可以通過添加此style="color:red"將樣式屬性添加到每個數字，以便該行看起來像這樣<div class="col-xs-4" style="color:red">。這會將文本的顏色變成紅色。或者你可以創建一個.CSS文檔，並通過將ID添加到每個div元素（id="firstLine"）中，然後將其放入.CSS文檔#firstLine{color:red;}中來設置它的樣式。 #字符用於按id設置樣式元素，而.字符用於按類別對元素進行樣式設置。 .CSS文檔是建議的樣式設計方法，因爲它可以保持代碼分離並且看起來很整齊。

來源

2015-06-24 21:05:33 brinegjr

您可以爲每個div添加id或其他類並獨立設置它們的樣式。

來源

2015-06-24 21:03:35 mtsears

這可以幫助你：

更新與演示

.col-xs-4:nth-child(1) 
 
    { 
 
    color:red; 
 
    } 
 
    .col-xs-4:nth-child(2) 
 
    { 
 
    color:green; 
 
    } 
 
    .col-xs-4:nth-child(3) 
 
    { 
 
    color:blue; 
 
    }

<div class="info-down"> 
 
     <div class="container"> 
 
      <div class="row"> 
 
       <div class="col-xs-4">24</div> 
 
       <div class="col-xs-4">07</div> 
 
       <div class="col-xs-4">15</div> 
 
      </div> 
 
     </div> 
 
</div>

來源

2015-06-24 21:03:35 divy3993

如何在相同的div標籤下獨立設計一組元素？

回答

相關問題