>웹 프론트엔드 >CSS 튜토리얼 >CSS 불투명도 - 이미지 반투명성을 달성하는 코드_경험 교환

CSS 불투명도 - 이미지 반투명성을 달성하는 코드_경험 교환

WBOY
WBOY원래의
2016-05-16 12:08:202306검색

얼마 전 웹 디자인을 하는 친구가 저에게 이런 질문을 했습니다. CSS를 통해 이미지의 반투명 효과를 얻는 방법은 IE와 Mozilla 모두에서 지원됩니다. 아래에서 내 방법을 공유하겠습니다.

아래 그림은 CSS를 통해 얻은 이미지 투명도 효과를 보여줍니다

CSS

이 효과는 IE와 Mozilla 브라우저 모두에서 작동하며 코드는 다음과 같습니다

CSS 불투명도 - 이미지 반투명성을 달성하는 코드_경험 교환

IE에서는 "불투명도"를 "필터"를 통해 정의해야 하는 반면, Mozilla에서는 "불투명도"를 직접 파싱할 수 있으므로 두 브라우저에서 이 효과를 지원하려면 두 가지 All을 결합해야 합니다. 설정이 추가됩니다. IE의 설정: this.filters.alpha.opacity=50 및 Mozilla의 설정: this.style.MozOpacity=0.5 이 코드 줄을 사용하여 이미지 주소만 수정하면 됩니다. 그것을 달성하십시오.

링크가 포함된 이미지:
CSS

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