<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <meta charset="UTF-8"> <title>移动</title> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> <script src="resources/js/zepto-min.js" type="text/javascript"></script> <script type="text/javascript" src="resources/js/dialog.js"></script> <style type="text/css"> /* 如果最外层父div层有高度和宽度后,如果父div的高度和宽度变大,子div层不会变化。 父div的高度如何随着子div的高度变化而变化,父层不给高度和宽度。给一个共享的类选择器(all_1)设置 共享的宽度和高度,子div层 继承这个类选择器 */ *{margin:0;padding:0;} body{font-size:25px;font-family: "Open Sans", "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif; color:#666;} .all{height: auto!important;margin: auto; font-size: 2.2rem;position:absolute;top:0;left:0;z-index: 99;} .all_1{width:702px;height:auto;background: #FFF;} /*标题*/ .t_title{min-width:580px;min-height:20px;margin: auto; text-align: center;/*float: left;border: 3px solid red;*/} .t_title .t_h3{text-align: center; font-size: 3rem;font-weight: 100;} /*提示内容*/ .t_message{min-width: 580px;min-height:50px;margin: auto;/*float: left;*/border-bottom: 1px solid #d8d8d8; line-height: 7rem;font-size: 2.5rem;} .t_message span{ display: block;line-height: inherit;/*float:left;*/padding-left: 20px; overflow: auto;color: #7d7d7d;} /*确定按钮*/ .t_btn{min-width: 100px;min-height:30px;margin: auto;text-align: center;/*float: left;*/} .t_btn input{ width: 105px;height: 52px;color: #fc9120;border: 0; background: #fff;margin: 19px auto;font-size: 2.7rem;} .t_btn input:hover{background:#EAEAEA;outline:none; } /*阴影*/ .tz_yy{width: 100%;height: 100%;background: #000;opacity: 0.4;filter: alpha(opacity=40);position: fixed; top:0;left: 0;} /*.clear_both{clear:both;}*/ </style> </head> <body> <div class="all all_1"> <div class="all_1 t_title "> <span class="t_h3">是否支付成功?</span> <%-- <div class="t_clear"></div>--%> </div> <%-- <div class="clear_both "></div>--%> <div class="all_1 t_message"> <span class="t_con">很抱歉,支付失败!</span> </div> <%-- <div class="clear_both"></div>--%> <div class="all_1 t_btn"> <input type="button" value="确定" id="qd"/> </div> <%-- <div class="clear_both"></div>--%> </div> <div class="tz_yy"></div> <script type="text/javascript"> $("#qd").click(function(){ alert(3) $.dialog(); }); </script> </body> </html>
移动端弹窗
最新推荐文章于 2024-06-04 09:15:09 发布