.ewb-mesgbox {
position: relative;
width: 500px;
background-color: #fff;
}
.ewb-msgbox-hd {
height: 60px;
line-height: 60px;
text-align: center;
font-size: 20px;
background-color: #f5f5f5;
}
.ewb-colse {
display: block;
width: 14px;
height: 14px;
font-size: 14px;
color: #999;
position: absolute;
right: 15px;
top: 15px;
z-index: 9999;
cursor: pointer;
background: url(../images/close_btn.png) center center no-repeat;
}
.ewb-msgbox-notice {
height: 140px;
line-height: 140px;
font-size: 16px;
color: #104382;
text-align: center;
}
.ewb-msgbox-bd2 {
padding: 34px 0;
}
.ewb-msgbox-notice2 {
font-size: 16px;
color: #104382;
text-align: center;
line-height: 24px;
}
然后创建一个在html文件中去新增一个模板:
<script type="text/x-template" id="msgbox">
<div class="ewb-mesgbox">
<span class="ewb-colse"></span>
<div class="ewb-msgbox-hd">提示</div>
<div class="ewb-msgbox-bd">
<p class="ewb-msgbox-notice">对不起,........!</p>
</div>
</div>
</script>
我们在页面中引入layer插件
open($('#msgbox'));
就可以弹出比较好看的框:
希望对你有所帮助