如何添加不同的顏色到網站的列

我期待添加不同的顏色到我的網站的2列？我有css代碼說明顏色，但我似乎無法得到添加兩種顏色。有人能幫我解決我做錯了什麼嗎？謝謝如何添加不同的顏色到網站的列

HTML代碼：

<section id="education" name="education"></section> 
 
    <div id="myeducation1"> 
 
\t <div class="container"> 
 
\t  <div class="row"> 
 
\t \t <div class="col-xs-6"> 
 
\t \t <p>Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.</p> 
 
\t \t </div> 
 
       <div class="col-xs-6"> 
 
\t \t <p>Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.</p> 
 
\t \t </div> 
 
\t  </div> 
 
\t </div> 
 
    </div> 
 
</section>

#myeducation1 { 
 
    background: #FF8C00;/*yellow*/ 
 
    padding-top: 30px; 
 
    padding-bottom: 30px; 
 
} 
 

 
#myeducation2 { 
 
    background: #ec576b;/*pink*/ 
 
    padding-top: 30px; 
 
    padding-bottom: 30px; 
 
}

來源

2016-11-26 a.man

您可以包含正在使用的CSS嗎？ –

我已經添加了上面的代碼。我沒有太多的代碼技巧，所以我甚至不知道如果我正確地做到這一點。欣賞幫助 –

這是你使用的真實代碼嗎？因爲您發佈的內容會將代碼應用於很多文字 –

你想要什麼樣的色彩形式的？正如我所看到的，只有一個＃myeducation1，沒有＃myeducation2。如果你想在同一張表的兩列上繪製不同的顏色，你應該修改.col-xs-6，而不是＃myeducation1。順便說一句.col-xs-6 css適用於所有具有此CSS的元素。分別添加另一個類別

來源

2016-11-26 02:36:53

您的css引用了兩個不同的ID，並且只使用了一個。一個簡單的方法來實現你想要的是將這些ID應用到正確的元素。

修改後的代碼如下所示（請注意如何你原來的班#myeducation1和#myeducation2已應用於直接到列的div）

HTML：

<section id="education" name="education"></section> 
<div id="topDiv"> <!-- this class replaces the one you had here, keeping padding only --> 
    <div class="container"> 
    <div class="row"> 
     <div id="myeducation1" class="col-xs-6"> 
     <p>Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.</p> 
     </div> 
     <div id="myeducation2" class="col-xs-6"> 
     <p>Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at </p> 
     </div> 
    </div> 
    </div> 
</div>

CSS：

#topDiv { /* this replaces the old reference you had at #myeducation1*/ 
    padding-top: 30px; 
    padding-bottom: 30px 
} 

#myeducation1 { 
    background: #FF8C00; 
} 

#myeducation2 { 
    background: #ec576b; 
}

來源

2016-11-26 02:56:24 Pineda

這是因爲您沒有使用#myeducation2而發生的您的html代碼。我添加了一個代碼片段，並添加了該代碼。

#myeducation1 { 
 
\t background: #FF8C00;/*yellow*/ 
 
\t padding-top: 30px; 
 
\t padding-bottom: 30px; 
 
} 
 

 
#myeducation2 { 
 
\t background: #ec576b;/*pink*/ 
 
\t padding-top: 30px; 
 
\t padding-bottom: 30px; 
 
}

<section id="education" name="education"></section> 
 
\t <div > 
 
\t \t <div class="container"> 
 
\t \t \t <div class="row"> 
 
\t \t \t \t 
 
\t \t \t \t <div class="col-xs-6" id="myeducation1"> 
 
\t \t \t \t \t 
 
\t \t \t \t \t <p>Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus. 
 
             </p> 
 
\t \t \t \t 
 
\t \t \t \t </div> 
 
           
 
            <div class="col-xs-6" id="myeducation2"> 
 
\t \t \t \t \t <p>Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus.Donec id elit non mi porta gravida at eget metus. 
 
             </p> 
 
\t \t \t \t 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div>

來源

2016-11-26 03:23:22

謝謝！那工作 –

@ a.man然後接受答案（只勾選它.. !!）:( –

你剛纔忘了添加其他分區。將myeducation1的編號添加到一個div，將myeducation2添加到另一個，並且它應該可以工作

來源

2016-11-26 03:53:49

如何添加不同的顏色到網站的列

回答

相關問題