배경의 투명한 텍스트의 불완전성에 대해 여전히 걱정하고 있다면 살펴 보는 것이 좋습니다. 물론, 나는 IE6을 포기 했으므로 IE6에서는 PNG8 사진이 효과적이지 않다고 말하지 마십시오. 물론 필터를 사용할 수도 있습니다. 필터를 사용하지 않는 것이 좋습니다. 이것은 다른 문제가있을 수 있기 때문입니다! (클릭하고 기다릴 수없는 경우) 프론트 엔드를 가장 두려워하는 것은 버그, 특히 IE6입니다. IE6을 출시하십시오!
이 기사의 핵심은 PNG32 투명 그림을 사용하여 배경을 만들고 배경을 놓는 것입니다. 이런 식으로 배경에는 투명한 텍스트가 없습니다. 그렇게하는 것은 매우 간단합니다!
그림은 투명성을 조정하면됩니다.
PSD에서 PNG에서 사진의 투명성을 20%로 저장하십시오.
(모드를 회색으로 설정하지 마십시오. 이것은 PNG8이됩니다. 투명성은 없습니다.)
배경은 투명하고 텍스트는 불투명합니다. 하하. IE 6이 나가고 있습니다! 지원 : IE7.0+/FF3.0+/OPERA10+/Chrome/Safari. 두 테스트 모두 통과했습니다.
효과 맵은 다음과 같습니다.
전체 코드는 다음과 같습니다.
다음과 같이 코드 코드를 복사하십시오.
<!
<html xmlns = "http://www.w3.org/1999/xhtml">
<헤드>
<meta http-equiv = "content-type"content = "text /html; charset = gb2312" /> />
<title> ie7+배경 투명, 텍스트 불투명 및 매우 간단한 방법 </title>
<스타일>
p {마진 : 0;}
.BG {너비 : 280px; 5px;
.bg1 {배경 : #000;
.BG2 {배경 :#f60;}
.com {url : //images/css_bg.png).
</스타일>
</head>
<body>
<div>
<div> <p> 배경은 투명하고 텍스트는 불투명합니다. 하하. IE 6 Get Oks <br/> 지원 : <br />ie7.0+/ff3.0+/opera10+/chrome/safari <br/> 모든 테스트 패스. 투명성은 다음과 같습니다. 20%</p> </div>
</div>
<div>
<div> <p> 배경은 투명하고 텍스트는 불투명합니다. 하하. IE 6 GET OKS <br/> 지원 : <br />ie7.0+/ff3.0+/opera10+/chrome/safari <br/> 모든 테스트 패스. 투명성은 다음과 같습니다. 20%</p> </div>
</div>
</body>
</html>