首页 > 代码库 > 背景色为半透明的例子

背景色为半透明的例子

2024-07-03 15:29:40   227人阅读

效果图

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>rgba</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
</head>
<style type="text/css">
    .content{
        height:300px;
        width: 600px;
        margin-top:-290px;
        margin-right: auto;
        margin-left: auto;
        background-color: #FFF0F5;
        z-index: 1;/*z值越大，越在上面*/


    }
    .border{
        height: 300px;
        margin-left: auto;
        margin-right: auto;
        width: 620px;
        margin-top: 60px;
        background: none repeat scroll 0 0 rgba(255, 255, 255, 0.5);/*关键代码，透明度*/
        z-index: 0;/*0为最下面的这一层，显示最下面*/
    }
    body{
        background-color: #EDEDED3;
    }
</style>
<body>3
     <!--透明边框 -->
    <div class="border"></div>
    <!-- 主要内容 -->
    <div class="content"></div>
</body>
</html>

 


联系
我们