6

これは難しい質問かもしれません。

rgba()引数で色の値を返すphp関数があります$alpha

function colorWheel($alpha) {

   "rgba(170, 135, 178, ".$alpha.")"
   …
}

そのため、電話をかけると…</p>

.title { color: <?php echo colorWheel(.8); ?>; }

…わかりましたrgba(170, 135, 178, .8);


これに関する問題は、色が「透明」で「オーバーレイ」が表示されることです。

ここに画像の説明を入力

しかし、私が本当に望んでいるのは、カラー値の 80% だけです! 透明なオーバーレイなし。

問題は、これをどのように解決するかです。

それを行うための創造的なアイデアはありますか?私はそれを使用する必要はありませんrgba()。それは私の頭に浮かんだ最も簡単なことです。アルファ値を持つオーバーレイ形状をブレンドしないCSSの方法はありますか?

または、 の80%バージョンを計算するための PHP ソリューションはありrgb(170, 135, 178)ますか? 関数にはより多くの色があるため、この計算が関数で動的に機能することが重要です。これは、「日付とランダムに基づいて色の値を返す方法は?」の補足質問です !

前もって感謝します。

4

3 に答える 3

1

問題は、「色の 80%」の定義が実際に何であるかです。

CSS には現在、RGB と HSL の 2 つの色空間があります (実際にはかなりよくサポートされています)。

次の RGB 計算を行うことができます。

function colorWheel($alpha) {

    'rgba('.$r*$alpha.','.$g*$alpha.','.$b*$alpha.', 1)';
    …
}

または、HSL を使用して、輝度 (または彩度) チャネルを 20% 減らすこともできます。HSL 色空間は、色を暗くしたり明るくしたりするときに、より直感的です。

function colorWheel($alpha) {

    "hsla($h,$s,".$l*$alpha.",1)";
    // or
    // ("hsla($h, "+$s*$alpha+", $l, 1)";)
    …
}

これらはすべて (わずかに) 異なる結果をもたらします。

色空間は、それほど複雑ではない式を介して相互に変換できます。おそらく、ランダムなカラーピッカー(たとえば、これまたはあれ)を見て、どの計算方法が最適かを判断する必要があります。

于 2013-01-18T12:46:10.020 に答える
0

不透明度で色をシミュレートするには、背景色も必要です。それR,G,Bが背景色のコンポーネントであり、色のコンポーネントであるとしr,g,bましょう。特定の背景で不透明色をシミュレートする場合は、同じ運河の対応する値を取得し、特定の重みでそれらを追加する必要があります。

r = r*alpha + R*(1-alpha)
g = g*alpha + G*(1-alpha)
b = b*alpha + B*(1-alpha)

簡単な例を見てみましょう。 背景(白)alpha = 0.8 に色(赤)を乗せたい。つまり、色の 80% + BG の 20% の合計が必要です。rgb(r,g,b) = rgb(255,0,0)rgb(R,G,B) = rgb(255,255,255)

r = 255*0.8 + 255*0.2 = 255
g = 0*0.8 + 255*0.2 = 51
b = 0*0.8 + 255*0.2 = 51
于 2013-01-18T12:38:51.630 に答える
0

それはそれを行う必要があります:

function colorWheel($alpha) {
    $r = round(170 * $alpha);
    $g = round(135 * $alpha);
    $b = round(178 * $alpha);
    "rgba($r, $g, $b, 1)";
    …
}

それは色を暗くします。明るくしたい場合は、アルファを値 > 1 に設定する必要があります。また、r、g、または b が 255 を超えているかどうかを確認し、超えている場合は 255 に設定します。

于 2013-01-18T12:25:57.067 に答える