examples/css3.html

<!DOCTYPE html>
<html>
    <head>
        <title>by 司徒正美</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="../avalon.js"></script>
        <script>
            avalon.define("test", function(vm) {
                vm.o = 0.5
            })

        </script>
        <style>
            .outer{
                width:200px;
                height: 200px;
                position: absolute;
                top:1px;
                left:1px;
                background: red;
                z-index:1;
            }
            .inner{
                width:100px;
                height: 100px;
                position: relative;
                top:20px;
                left:20px;
                background: green;
            }
        </style>
    </head>
    <body ms-controller="test" >
        <h3>在旧式IE下，如果父元素是定位元素,但没有设置它的top, left, z-index，那么为它设置透明时,
            它的所有被定位的后代都没有透明</h3>

        <div class="outer" ms-css-opacity="o">
            <div class="inner"></div>
        </div>
        <div style='width:100px;height:100px;position:absolute;top:200px;' ms-css-background="'red'">

        </div>
    </body>
</html>