自定义 success, warn, danger 等提示框

来源:互联网 发布:c语言char范围 编辑:程序博客网 时间:2024/06/08 12:00

页面

<!DOCTYPE html><html>    <head>        <style type="text/css">            ul, ol, li {                list-style-type: none;                margin: 0;                padding: 0;            }            .alert100 {                margin-right: -12px;float:left;min-width: 100%;            }            .alert100 li {                width: 307px;height:150px;line-height:150px;text-align:center;margin-right: 12px;                float:left;border-radius: 3px;            }            .message1 {                background: none repeat scroll 0% 0% #F5FFE8;border: 1px solid #C2FF68;            }            .message2 {                background: none repeat scroll 0% 0% #FFECEC;border: 1px solid #FFD2D2;            }            .message3 {                background: none repeat scroll 0% 0% #FFFDF1;border: 1px solid #FAE798;            }        </style>    </head>    <body>        <ul class="alert100">            <li class="message1">效果展示1</li>            <li class="message2">效果展示2</li>            <li class="message3">效果展示3</li>        </ul>    </body></html>

显示效果

这里写图片描述

原创粉丝点击