CSS是網頁開發中不可或缺的一部分，其中背景顏色和背景圖片的運用是制作網頁時必不可少的要素之一。在很多情況下，需要將背景顏色寫在背景圖片上面，以達到更好的視覺效果。接下來，我們將介紹如何使用CSS實現這個效果。

首先需要在HTML文件中定義一個div標簽，并設置其class屬性為"container"。

<div class="container">
...
</div>

接著在CSS文件中設置.container的background屬性為背景圖片的路徑。

.container {
background-image: url('圖片路徑');
...
}

最后，需要使用:before偽元素來將背景顏色寫在圖片上。

.container::before {
content: "";
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255,255,255,0.5); /* 設置背景顏色，這里使用半透明白色 */
}

通過這種方式，就可以實現在背景圖片上方覆蓋一個背景顏色的效果了。

此外，在使用這種方法時，還需要注意容器的定位和z-index屬性的設置，以確保背景顏色位于背景圖片之上。

總的來說，CSS的背景顏色寫到背景圖片上是一種非常實用的技巧，可以幫助我們制作更加豐富、獨特的網頁布局。