使用css设计弹出窗口

来源:互联网 发布:webuploader php接收 编辑:程序博客网 时间:2024/06/04 19:17

css文件

.glass{ background-color: #666 ;        width: 100%;        height: 100%;        left: 0;        top: 0; /*FF IE7*/        filter: alpha(opacity=50) ; /*IE*/        opacity: 0.5; /*FF*/        z-index: 1;        position: fixed !important; /*FF IE7*/        position: absolute; /*IE6*/        display : block;}.showbox{background: white;position: absolute;display: block;z-index: 2;width: 600px;height: 400px;top: 25%;left: 30%;}.hidden{display: none;}#showbox #boxmenu{background:RGB(52,101,164);height:35px;font-size:larger;color:white;}#showbox #boxmenu #title{padding-left: 10px;padding-top: 10px;float:left;}#showbox #boxmenu #close{float:right;padding-right: 20px;margin-top:2px;cursor:pointer;background: url(../images/pop-up-close.png) no-repeat;height: 30px;width: 25px;}#showbox #boxmenu #close:active{background:url(../images/closeRed.png) no-repeat;}    #showbox #boxhead{    clear:both;    float: left;    padding-top: 10px;    padding-left: 10px;    }    #showbox #boxbody{    clear: both;    padding-top: 10px;    }    #showbox #boxbody div{    float: left;    padding-left:10px;    width: 40%;    }    #showbox #boxbody div input{    cursor:pointer;    }    #showbox #boxsubmit{    clear: both;    padding-top: 20px;    padding-left: 20px;    }    #showbox #boxsubmit input{    height:35px;    width:80px;    background-color: RGB(52,101,164);    color:white;    font-size:larger;    cursor:pointer;    }

想让弹出窗口隐藏的时候把对应部分的class设置为hidden,想让弹出式使用class为showbox,想设置透明效果时设置为glass

原创粉丝点击