png图片在ie6下透明效果

前一阵发现了一个问题,png格式的透明图片在ie6下透明部分还是会有底色,找了一下解决方法发现有一个叫AlphaImageLoader的滤镜可以解决这个问题,以下的代码是从网上找来的,加了点注释。

 

<!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">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>无标题文档</title>

    <style type="text/css">

        img

        {

            border: 0;

        }

        body

        {

            background-color: #999;

        }

        .bigName .logo

        {

            /* 就是这个滤镜,需要进一步了解的同学请参考http://msdn.microsoft.com/en-us/library/ms532969(v=vs.85).aspx */

            _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='Images/logo.png');

            _background-image: none;

        }

        h1.logo

        {

            width: 153px;

            height: 59px;

        }

        h1.logo a

        {

            display: block;

            height: 59px;

            width: 153px;

        }

    </style>

</head>

<!-- 加个背景图片 -->

<body style=" background-image:url('Images/bg.jpg')">

    <div class="bigName">

        <h1 class="logo">

            <a href="javascript:;" id="id1"></a>

 

            <script type="text/javascript">

                var isie6 = window.XMLHttpRequest ? false : true;

                // ie6以上版本直接显示在控件中,ie6的话用背景显示

                if (!isie6) {

                    document.getElementById('id1').innerHTML = '<img src="Images/logo.png" />';

                }

            </script>

 

        </h1>

    </div>

</body>

</html>

 

效果:

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值