仿alert、confirm的弹出框。

弹出后，用遮罩层将背景虚化。

代码如下：

     
     
     
提示消息
     
      
       删除确认
       
      
      
       
        
         
          
           
           
            
             彻底删除后邮件将无法恢复，您确定要删除吗？
            
            
           
          
          
           
           
          
         
        
        
         
          确定
          取消
          
         
         
        
       
      
     

css如下：

/* 弹出框 */select, body, textarea {font-size: 12px;}.qm_dialog {position: absolute;overflow: hidden;z-index: 12;border: 1px solid #aaa;box-shadow: 0 0 8px rgba(0,0,0,0.2);border-radius: 5px;min-width: 440px;_width: 440px;background-color: #eaeaea;}.dialog_head {background-color: #eaeaea;padding: 5px 15px;line-height: 25px;font-weight: bold;border-radius: 5px 5px 0 0;border-bottom: 1px solid #ccc;}.dialog_inner {border-radius: 0 0 5px 5px;overflow: hidden;}.ico_close_d:hover {background-position: -54px -240px;}.ico_close_d, .qm_dialog .ico_minimize {position: absolute;right: 10px;top: 9px;background: url(../images/mail.png) no-repeat -18px -240px;width: 18px;height: 18px;border-radius: 2px;}.dialog_icon {float: left;margin: 7px 12px 8px 0;}.dialog_content {background-color: #fff;}.icon_info_b {width: 32px;height: 32px;background: url(../images/prompt.png) no-repeat -96px 0;}.cnfx_content {padding: 23px 30px 30px 37px;text-align: left;}.cnfx_status {float: left;padding: 9px 0 0 10px;}.btn_gray {margin: 0 0 1px 3px;}.btn_gray {border: 1px solid #888;color: #000000;color: #000000!important;background: #F3F3F3;background: -moz-linear-gradient(top,#ffffff 0%,#ebebeb 90%,#F3F3F3 100%);background: -webkit-linear-gradient(top,#ffffff 0%,#ebebeb 90%,#F3F3F3 100%);background: -o-linear-gradient(top,#ffffff 0%,#ebebeb 90%,#F3F3F3 100%);background: -ms-linear-gradient(top,#ffffff 0%,#ebebeb 90%,#F3F3F3 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#d7d7d7',GradientType=0 );background: linear-gradient(top,#ffffff 0%,#ebebeb 90%,#F3F3F3 100%);}.btn_gray {display: inline-block;height: 22px;min-width: 24px;line-height: 22px;line-height: 23px\9\0;font-family: Simsun\9;_overflow-y: hidden;padding: 0 12px;margin: 0;text-align: center;text-decoration: none;vertical-align: middle;cursor: default;-moz-user-select: none;-webkit-user-select: none;border-radius: 3px;border-radius: 0\9\0;}.cnfx_btn {text-align: right;}.txt_right {text-align: right;}.dialog_operate {background-color: #eaeaea;padding: 5px 12px;text-align: right;line-height: 25px;border-top: 1px solid #ccc;}.dialog_f_c {margin-left: 44px;padding-top: 8px;line-height: 1.9;font-size: 14px;}.shade{opacity: 0.5;filter: alpha(opacity=50);background: #fff;width:100%;height:100%;position: absolute;z-index:999;display:block;}

主要是一些布局，以及绝对定位。其中shade用于遮罩用。