CSS颜色透明渐变_background 渐变色透明色

作者：我家自动化 | 2024-05-13 15:18:25

踩

background 渐变色透明色

<html>
<head>
    <style type="text/css" >
        #TopBackGround
        {
            width:200px;
            height:300px;
            margin:0 100px 0 0 ;
            background-image:url(background_img.png);
            position:relative;
            z-index:-1;
        }

        #backgroundbg2
        {
            position:absolute;
            top:0;
            background: -webkit-gradient(linear,center top,center bottom,from(rgba(255, 255, 255, 0.1)),to(rgba(255, 163, 204, 0.5)));
            z-index:-1;
        }

        #mainContents
        {
            position:absolute;　　　　　　　　　　 word-wrap:break-word；
            width:60%;
            height:50%;
            background-color:red;
            margin:10% 20% 0 20%;
            z-index:1;
        }
    </style>
    <script type="text/javascript">

    </script>
</head>
<body>
    <div id="TopBackGround">
        <div id="backgroundbg2"></div>
        <div id="mainContents">
            testtesttestetesttesttest
        </div>
    </div>
    <script type="text/javascript" >

var interval = null,
oldHeight = 0;

interval = setInterval(update, 1000);

function update() {

var TopBackGround = document.getElementById("TopBackGround"),
backgroundbg2 = document.getElementById("backgroundbg2");

                if (oldHeight != TopBackGround.offsetHeight) {
                    oldHeight = TopBackGround.offsetHeight
                    backgroundbg2.style.height = oldHeight + "px";
                    backgroundbg2.style.width = TopBackGround.offsetWidth + "px";
                }
            }
    </script>
</body>
</html>

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/我家自动化/article/detail/564104

CSS颜色透明渐变_background 渐变色 透明色

CSS颜色透明渐变_background 渐变色透明色