>  기사  >  웹 프론트엔드  >  CSS에서 배경 레이어 투명도를 설정하는 방법

CSS에서 배경 레이어 투명도를 설정하는 방법

小云云
小云云원래의
2017-11-27 09:47:532670검색

CSS는 웹 페이지의 요소 위치 레이아웃을 픽셀 수준으로 정밀하게 제어할 수 있고, 거의 모든 글꼴 크기와 스타일을 지원하며, 웹 페이지 개체와 모델 스타일을 편집할 수 있습니다. HTML에서 특정 레이어의 배경을 투명하게 설정해야 하는 경우 어떻게 설정해야 합니까? CSS를 사용하여 투명 레이어 효과를 설정하는 방법을 공유해 보겠습니다. 이 방법은 모든 브라우저에서 호환됩니다.

다음은 특정 코드입니다(위 효과는 0.8로 설정됨).

 .transparent{    
filter:alpha(opacity=50);    
-moz-opacity:0.5;    
-khtml-opacity: 0.5;    
 opacity: 0.5;    
 }

효과를 살펴보겠습니다.

CSS에서 배경 레이어 투명도를 설정하는 방법

다음은 위 CSS 코드에 대한 몇 가지 추가 지침입니다.

불투명도: 0.5; 이 속성은 현재 CSS에 투명도를 설정하는 표준 속성이 있습니다. Firefox, Safari, Opera 등 대부분의 브라우저 버전에서 작동합니다.

filter:alpha(opacity=50); 이 속성은 IE 브라우저만 지원합니다.

-moz-opacity:0.5; 이 속성은 Netscape Navigator와 같은 일부 이전 Mozilla 브라우저와의 하위 호환성을 위한 것입니다.

-khtml-opacity: 0.5; 이 속성은 현재 WebKit과 달리 KTHML이라는 렌더링 엔진을 사용하는 이전 버전의 Safari(1.x)와의 호환성을 위한 것입니다.

위 내용은 CSS에서 투명 레이어 효과를 설정하는 방법입니다. 모든 분들께 도움이 되었으면 좋겠습니다.

관련 권장 사항:

css에서 투명도를 설정하는 방법

CSS3의 새로운 콘텐츠를 사용하여 예제를 통해 투명 삼각형을 만드는 방법 구현

ccs 투명 속성 및 배경 투명도 상속 방법에 대한 자세한 예

CSS 설정 방법 div 배경 투명 스타일 분석 예시

배경색을 투명하게 설정하는 튜토리얼 예시

위 내용은 CSS에서 배경 레이어 투명도를 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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