내 텍스트가 CSS에서 배경 불투명도를 상속받는 이유는 무엇입니까?

CSS 배경 불투명도 재검토

CSS를 사용할 때 배경 불투명도를 설정하고 해당 컨테이너 내의 텍스트를 기대하는 시나리오가 발생할 수 있습니다. 완전히 불투명하게 유지합니다. 그러나 텍스트도 배경의 불투명도를 상속하여 희미한 모양을 나타냅니다.

이러한 동작은 CSS에 내재되어 있습니다. 텍스트를 포함한 하위 요소는 상위 요소의 불투명도 속성을 상속합니다. 이 문제를 해결하기 위한 몇 가지 옵션이 있습니다.

• 배경 이미지에 반투명 PNG 파일을 사용합니다. 반투명 PNG 이미지는 다양한 불투명도를 지원하므로 텍스트에 대해 원하는 불투명도를 유지하면서 부분적으로 투명한 배경.
• 배경에 RGBa 색상 사용: RGBa는 불투명도를 위한 알파 채널을 포함하는 확장된 색상 형식입니다. 투명도 비율과 함께 RGBA 값을 지정할 수 있습니다. 예:

<code class="css">background-color: rgba(0, 0, 0, 0.5);</code>

이 코드는 배경색을 50% 투명 검정색으로 설정하여 텍스트를 완전히 불투명하게 유지합니다.

위 내용은 내 텍스트가 CSS에서 배경 불투명도를 상속받는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!