>웹 프론트엔드 >CSS 튜토리얼 >웹 브라우저에서 유니코드 이모티콘에 색상을 지정하려면 어떻게 해야 합니까?

웹 브라우저에서 유니코드 이모티콘에 색상을 지정하려면 어떻게 해야 합니까?

DDD
DDD원래의
2024-12-02 22:58:13585검색

How Can I Color Unicode Emojis in Web Browsers?

브라우저에서 유니코드 이모티콘 색칠하기

최신 웹 브라우저에서는 이모티콘 문자를 통합하는 것이 가능합니다. 그러나 선택한 색상에 대한 제어를 유지하면서 어떻게 특정 색상으로 렌더링합니까?

다음 예를 고려하십시오.

<p>
  ???
</p>
<p>
  ♥★ℹ
</div>

p {
  font-size: 3em;
  color: red
}

이 HTML 및 CSS는 빨간색이지만 텍스트만 지정된 색상으로 렌더링됩니다.

이모지를 색상으로 렌더링

하려면 이모티콘 문자 색상 지정:

div {
  color: transparent;  
  text-shadow: 0 0 0 red;
}

태그에서 색상 속성을 투명으로 설정하여 텍스트를 보이지 않게 렌더링합니다. 그런 다음 텍스트 그림자를 사용하여 오프셋이 0이고 선택한 색상을 세 번째 매개변수로 사용하여 원하는 색상의 텍스트 효과를 만듭니다.

위 내용은 웹 브라우저에서 유니코드 이모티콘에 색상을 지정하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.