线性渐变和图像不工作的背景图像(使用Wordpress)

时间:2015-04-16 22:34:24

标签: html css wordpress less

这是代码:

style="background-image: linear-gradient(151deg,#6a7a8f 9%,#8692A4 30%,#a9b1be 49%, #ced2d9 66%, #f1f0f1 88%),url(<?php echo $page['image']; ?>);"

它在div上,由于某种原因,线性渐变是唯一出现的东西。当我将url()放在线性渐变之前时,图像就是唯一出现的图像。

我检查了其他非常相似的stackoverflow问题,但我无法让它工作。

1 个答案:

答案 0 :(得分:2)

您使用的是纯色(HEX),因此它们会覆盖您的图像。您必须使用 RGBA 颜色。

像这样:

style="background-image: linear-gradient(151deg,rgba(106,122,143,0.5) 9%,rgba(134,146,164,0.5) 30%,rgba(169,177,190,0.5) 49%, rgba(206,210,217,0.5) 66%, rgba(241,240,241,0.5) 88%),url(<?php echo $page['image']; ?>);"