如何設置ap元素的背景顏色也爲上面的圖像設置背景顏色

因此我創建了一個帶有標題的圖像庫，並且我像以前一樣困惑，我從來沒有這樣做過，但現在當我設置p元素的背景顏色，它也設置元素背後的背景。到目前爲止，我已經嘗試了幾件事情，比如將圖像的背景顏色設置爲none和其他東西，但沒有任何工作，任何幫助將不勝感激！這裏是我的代碼片段，我會很樂意更新所需的更多信息。如何設置ap元素的背景顏色也爲上面的圖像設置背景顏色

HTML

<div id="wrapper"> 

    <ul id="products"> 
     <li><a href="ambco.html"><img src="img/650a.jpg" alt=""><p>Hello I am Jacob 
     and I'm confused as hell and this doesn't make sense...</p></a></li> 
     <li><p>Hello I am Jacob and I'm confused as hell and this doesn't 
     make sense...</p></li> 
     <li><p>Hello I am Jacob and I'm confused as hell and this doesn't 
     make sense...</p></li> 
    </ul> 
</div>

CSS

#products { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    overflow: hidden; 
} 

#products li { 
    width: 95%; 
    margin: 2.5%; 
    float: left; 
} 

#products img { 
    margin-bottom: 15px; 
} 

#products p { 
    background-color: black; 
    color: brown; 
} 

#products a { 
    text-decoration: none; 
}

來源

2016-07-30 Boo89100

你能用jsfiddle重現嗎？我沒有和你的代碼一樣的輸出：https://jsfiddle.net/hsmb1pqz/ – Michael

你發佈了我自己的鏈接，你需要點擊編輯按鈕，左上角 – Michael

是啊我很笨：/ https： //jsfiddle.net/boo89100/xx0eq2t6/ – Boo89100

因爲你有float: left;爲<li>一切<li>正在崩潰之後 - 嘗試切換對於<li>元素上的display: inline-block;，這可能有效。

來源

2016-07-30 00:37:06 Toby

如何設置ap元素的背景顏色也爲上面的圖像設置背景顏色

回答

相關問題