1.截图：
2.css：
.warning-msg {display:block; bottom:0px; right:0px; position:fixed;} * html .warning-msg {position:absolute; right:18px} .notification { font-family:Digital,'Microsoft YaHei',STFangsong; display: flex; margin: 0 auto; width: 300px; min-height: 70px; } .notification .info { flex: 1; padding: 10px 10px 0 10px; background: #6c7e98; border-radius: 3px 0 0 3px; border-bottom: 3px solid #c0cdd1; } .notification .info span { margin: 0; padding: 0; font-size: 16px; color: #fff; } .notification .info p { margin: 0; padding: 5px 0; font-size: 12px; color: #c5bebe; } .notification .info .button { display: inline-block; margin: 3px 3px 5px 0; padding: 3px 7px; border-radius: 2px; border-bottom: 1px solid; font-size: 12px; font-weight: bold; text-decoration: none; color: #ecf0f1; } .notification .info .button.gray { background: #95a5a6 ; border-bottom-color: #798d8f; } .notification .info .button { background: #435d8a; border-bottom-color: #435d8a; }3.html：
<div class="warning-msg"> <div class="notification"> <div class="info"> <span></span> <p></p> <a href="#" class="button">详情</a><a href="#" class="button gray">忽略</a> </div> </div> </div>