알고 계신 분들이 많겠지만 혹여 모르시는 분들을 위해 알려드립니다.
익스플로어6에서 지원하지 않는 png파일을 투명하게 보이게 할겁니다.
1. 배경화면에 png파일 구현
#header {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='이미지이름.png', sizingMethod='crop');
}
#contents {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='이미지이름.png', sizingMethod='crop');
}
이렇게 속성을 적어주면 IE6에서도 작동되는걸 확인하실 수 있습니다.
2. 이미지형식의 png파일 구현
자바스크립트를 하나 추가하고 이미지에 클래스를 지정해 주면됩니다.
<script type="text/javascript">
function setPng24(obj)
{
obj.width = obj.height = 1;
obj.className = obj.className.replace(/\bpng24\b/i,'');
obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+ obj.src
+"',sizingMethod='image');"
obj.src = '';
return '';
}
</script>
html 소스
<img src="이미지이름.png" alt="png이미지" class="png24" />
IE6 전용 css
.png24 {tmp:expression(setPng24(this));}
출처: 네이버 블로그
'CSS' 카테고리의 다른 글
clearfix (0) | 2013.10.01 |
---|---|
clear (0) | 2013.01.25 |
CSS 스타일시트 속성정리 (0) | 2013.01.08 |
CSS레이아웃-플로트를 이용한 2단 레이아웃 (0) | 2013.01.08 |
CSS 레이아웃-중간 정렬하기 (0) | 2013.01.08 |