흰색 배경에 사용하기 위해 RGB 색상을 투명한 RGBA 색상으로 변환하려면 어떻게 해야 합니까?-CSS 튜토리얼-php.cn

흰색 배경에 사용하기 위해 RGB 색상을 투명한 RGBA 색상으로 변환하려면 어떻게 해야 합니까?

Linda Hamilton

풀어 주다： 2024-11-06 04:12:02

원래의

901명이 탐색했습니다.

How can I convert an RGB color to a transparent RGBA color for use on a white background?

흰색 배경에 대해 RGB를 투명 RGBA로 변환

흰색 배경 위에 색상을 표시할 경우 해당 색상이 투명하게 표시되도록 조정하는 것이 바람직합니다. 시각적 효과를 유지하면서 가능한 한. 이 프로세스에는 RGB에서 RGBA로의 변환이 포함되며, 여기서 알파 채널은 투명도 수준을 결정합니다.

RGB에서 RGBA로의 변환 알고리즘

다음 알고리즘은 RGBA를 계산합니다. 주어진 RGB 색상 구성 요소에 따른 값:

최소 구성 요소 식별: RGB 구성 요소 중에서 가장 작은 값을 결정합니다(최소 = 최소).
알파 값 계산: 최소 구성 요소를 알파 값(a)으로 변환: a = (255 - min) / 255.
RGB 구성 요소 크기 조정: 각 RGB 구성 요소에서 최소값을 빼고 결과를 알파 값으로 나눕니다. 이렇게 하면 구성요소의 크기가 조정됩니다.
- r = (r - min) / a
- g = (g - min) / a
- b = (b - min ) / a
RGBA 문자열 형식: 계산된 값을 사용하여 RGBA 문자열을 구성합니다: rgba(r, g, b, a).

구현:

<code class="javascript">function RGBtoRGBA(r, g, b) {
  if ((g == null) && (typeof r === 'string')) {
    var hex = r.replace(/^\s*#|\s*$/g, '');
    if (hex.length === 3) {
      hex = hex.replace(/(.)/g, '');
    }
    r = parseInt(hex.substr(0, 2), 16);
    g = parseInt(hex.substr(2, 2), 16);
    b = parseInt(hex.substr(4, 2), 16);
  }

  var min = Math.min(r, g, b);
  var a = (255 - min) / 255;

  return {
    r: 0 | (r - min) / a,
    g: 0 | (g - min) / a,
    b: 0 | (b - min) / a,
    a: (0 | 1000 * a) / 1000,
    rgba: 'rgba(' + r + ', ' + g + ', ' + b + ', ' + a + ')',
  };
}</code>

로그인 후 복사

예:

RGBtoRGBA(204, 153, 102) == RGBtoRGBA('#CC9966') == RGBtoRGBA('C96') ==
  {
    r: 170,
    g: 85,
    b: 0,
    a: 0.6,
    rgba: 'rgba(170, 85, 0, 0.6)'
  }

로그인 후 복사

위 내용은 흰색 배경에 사용하기 위해 RGB 색상을 투명한 RGBA 색상으로 변환하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!