2017-08-24 102 views
0

PHP - 尝试为要应用于单个CSS选择器的渐变背景定义两种颜色停止。我需要它们由用户单独选择(通过颜色选择器)。我一直在用PHP定义背景颜色(命名为:$ color_gradient &返回:'#f7f7f7';作为用户的默认开始),所以用户可以选择渐变的基本颜色(通过PHP ),然后我在css中设置了颜色到alpha的渐变叠加层(所以用户选择的背景颜色渐变为黑色或白色的结束颜色)以获得最接近我尝试完成的效果,但它仍然相当局限于我在叠加层的CSS中设置的任何颜色,并且我不希望用户必须编辑css文件中的颜色代码 - 我宁愿让PHP处理它以便用户可以定义渐变的颜色而不仅仅是一种颜色。PHP - 尝试为渐变背景区域定义两种颜色的中止区域,用户可以使用颜色选择器同时选择两种颜色

function theme_customizer_get_default_gradient_color() { 
    return '#f7f7f7'; 
} 

$color_gradient = get_theme_mod('theme_gradient_color', 
theme_customizer_get_default_gradient_color()); 

    $css .= (theme_customizer_get_default_gradient_color() !== $color_gradient) ? 
sprintf('  
    .nav-primary, 
    .site-footer { 
     background-color: %1$s; 
    } 
    ', $color_gradient) : ''; 

if (theme_customizer_get_default_gradient_color() !== $color_gradient 

有没有办法来定义类似“左” &“右”,在十六进制或RGB颜色,说,一个区域的背景颜色,这样在PHP中定义的两种颜色被视为各占一半的渐变和用户可以分别选择每种颜色,他们仍然融合在一起?

或者有没有办法让PHP处理覆盖(而不是在CSS中处理),这将保持一个alpha-to-color项目,而不是在用户选择一种新颜色后更改为纯色? (我担心一旦用户更改为默认设置以外的其他颜色时,透明度会被覆盖。)

我不想找任何人为我编码;我只需要在某个方向上轻轻一点。

回答

0

在CSS中,渐变使用背景图像。尝试在函数中为每种颜色和方向定义变量;例如:

background-image: linear-gradient(to right, $color1, $color2); 

更多信息:https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient

+0

可能的工作。我今晚会玩一下这个代码,看看它是否可以发挥一些魔力。谢谢。 –

+0

祝你好运;让我知道它是如何运作的,如果我能有更多的帮助。 – pixleight

+0

好吧,我不得不把它搁置几个星期,但最后我试图让这个功能完整。在这一点上,我有customize.php文件设置用户选择的两种颜色,但是,因为他们的目标是相同的CSS第二种颜色只是覆盖第一种,这是预期的,因为我没有任何进一步的方向应用于我希望代码混合两种颜色的方式。所以我的下一步就是放置你建议的代码片段。无论我把它放在哪里,大多数时候它都会被忽略(除非我把它白屏)。 –