修改系统默认 alert 弹框样式

原文链接：https://blog.csdn.net/sun124608666/article/details/72866735

1、封装重写alert的函数

function alert(e){
    $("body").append('<div id="msg"><div id="msg_top">温馨提示<span class="msg_close">×</span></div><div id="msg_cont">'+e+'</div><div class="msg_close" id="msg_clear">确定</div></div>');
    $(".msg_close").click(function (){
    $("#msg").remove();
    });
}

2、样式代码：

#msg{
    width:375px;
    height: 220px;
    position: fixed;
    z-index:999;
    top: 49%;
    margin-top:-80px;
    left:50%;
    margin-left:-133px;
    background:#fff;
    box-shadow:5px 5px 8px #999;
    font-size:17px;
    color:#666;
    border:1px solid #f8f8f8;
    text-align: center;
    line-height: 2rem;
    display:inline-block;
    padding-bottom:20px;
    border-radius:5px;
}
#msg_top{
    background:#30a2eb;
    padding:5px 15px 5px 20px;
    text-align: center;
    color: #fff;
    border-radius: 5px;
}
#msg_top span{
    font-size:22px;
    float:right;
    cursor:pointer;
}
#msg_cont{
    padding:45px 20px 50px;
    color: #676767;
    font-size: 20px;
}
#msg_clear{
    width: 110px;
    height: 35px;
    display:inline-block;
    color:#fff;
    padding:1px 15px;
    background:#30a2eb;
    border-radius:2px;
    margin-right:15px;
    line-height: 35px;
    cursor:pointer;
}