這篇文章主要講解了“怎么設(shè)置css背景圖片顏色”，文中的講解內(nèi)容簡單清晰，易于學(xué)習(xí)與理解，下面請(qǐng)大家跟著小編的思路慢慢深入，一起來研究和學(xué)習(xí)“怎么設(shè)置css背景圖片顏色”吧！

創(chuàng)新互聯(lián)建站成立與2013年，先為績溪等服務(wù)建站，績溪等地企業(yè)，進(jìn)行企業(yè)商務(wù)咨詢服務(wù)。為績溪企業(yè)網(wǎng)站制作PC+手機(jī)+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。

css中，可以利用background和background-blend-mode屬性來設(shè)置背景圖片顏色，語法格式“background: url(背景圖片路徑), 顏色值;background-blend-mode: lighten;”。

本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

利用background-blend-mode

代碼如下：

原圖：

效果圖：

說明：

lighten這個(gè)混合模式：變亮、變亮模式與變暗模式產(chǎn)生的效果相反，黑色比任何顏色都要暗，所以黑色會(huì)被任何色替換掉。反之，如果素材的底色是黑色，主色是白色。那就應(yīng)該用變暗（darken）的混合模式  。

linear-gradient(#f00,  #00f )還可以實(shí)現(xiàn)漸變顏色的效果哦。

感謝各位的閱讀，以上就是“怎么設(shè)置css背景圖片顏色”的內(nèi)容了，經(jīng)過本文的學(xué)習(xí)后，相信大家對(duì)怎么設(shè)置css背景圖片顏色這一問題有了更深刻的體會(huì)，具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是創(chuàng)新互聯(lián)，小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章，歡迎關(guān)注！