CSS는 배경을 투명하게 하고 텍스트를 불투명하게 만듭니다(모든 브라우저와 호환 가능).
- 巴扎黑원래의
- 2017-04-05 16:27:511652검색
FF/Chrome과 같은 최신 브라우저에서는 CSS 속성 background-color의 rgba를 사용하여 텍스트를 불투명하게 유지하면서 배경 투명도를 쉽게 얻을 수 있습니다. IE6/7/8 브라우저는 rgba를 지원하지 않으며 IE의 독점 필터인 filter:Alpha를 사용해야만 달성할 수 있습니다. 그러나 이 방법으로 작성하면 텍스트도 투명해지기 때문에 rgba의 하위 노드 내에서만 사용할 수 있습니다. 투명 컨테이너(텍스트 노드 제외) 상위 요소의 투명도 필터를 상속받지 않도록 위치:상대를 설정합니다.
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional .dtd">
<html xmlns=" http://www.w3.org/1999/xhtml">
<머리>
<메타 http-equiv="Content-Type" 콘텐츠="text/html; charset=utf-8" />
<제목>Web开发者网络 - www.admin10000.com제목>
<스타일 유형=" text/css">
.warp{ 배경: #eee url(back.jpg) 반복 없음 왼쪽 상단; 너비:440px; 높이:400px; 테두리:1px 단색 #ccc ;}
.content { 너비:180px; 높이:260px; 여백:0px 자동; 패딩:30px 30px; 배경:rgba(255, 255, 255, 0.6)!중요;
필터:알파(불투명도=60); 배경: #fff; /* IE 전용 필터를 사용하여 IE 배경 투명도 달성*/ }
.content p{ 위치:상대;} /*IE 텍스트 불투명도 실현*/
스타일>
머리>
몸>
<p 클래스="워프">
<p 수업="content"><p >Admin10000.com은 WEB 개발자들이 배우고 소통하는 데 꼭 필요한 웹사이트입니다. Admin10000.com은 WEB 개발자가 배우고 소통하는 데 꼭 필요한 웹사이트입니다. Admin10000.com은 WEB 개발자가 배우고 소통하는 데 꼭 필요한 웹사이트입니다. Admin10000.com은 WEB 개발자가 배우고 소통하는 데 꼭 필요한 웹사이트입니다. Admin10000.com은 WEB 개발자가 배우고 소통하는 데 꼭 필요한 웹사이트입니다. Admin10000.com은 WEB 개발자가 배우고 소통하는 데 꼭 필요한 웹사이트입니다. 피>피>
p>
body >
html>
위 코드는 IE6.0+/FF3.0+/Opera10+/Chrome/Safari
에서 테스트 및 통과되었습니다.
위 내용은 CSS는 배경을 투명하게 하고 텍스트를 불투명하게 만듭니다(모든 브라우저와 호환 가능).의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!