bootstrap錯誤警告信息提示

本文轉載自查看原文 2014-05-13 11:58 3638 錯誤警告信息/ bootsrap/ BootStrap

bootstrap提供了成功執行、警告和錯誤信息的樣式.

在使用該功能的時候需要引入以下幾個文件:

bootstrap.css

jquery.js(需放在bootstrap.js之前)

bootstrap.js(官方推薦引入的是bootstrap-alert.js)

主要使用的樣式:

.span4

.alert(默認樣式)

.alert alert-successs

.alert alert-error

.alert alert-info

實例代碼如下:

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
    <title>bootstrap警告錯誤</title>
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css">    
    <script  src="bootstrap/js/jquery.1.9.1.js"></script>
    <script  src="bootstrap/js/bootstrap.js"></script>
    
</head>    

<body>
    <div class="container">
        <h2>警告錯誤</h2>
        <div class="row">
        <div class="span4">
            <div class="alert">
                <a class="close" data-dismiss="alert">×</a>
                <strong>
                    Warning
                </strong>這里是警告提示信息
            </div>
            <div class="alert alert-success">
                <a class="close" data-dismiss="alert">×</a>
                <strong>
                    Success
                </strong>這里是成功提示信息
            </div>
            <div class="alert alert-info">
                <a class="close" data-dismiss="alert">×</a>
                <strong>
                    Info
                </strong>這里是信息提示信息
            </div>
        </div>
    </div>
</div>
</body>
</html>

View Code

效果如圖:

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 yii中設置提示成功信息，錯誤提示信息，警告信息 BootStrap 警告提示框 odoo開發筆記 -- 異常、錯誤、警告、提示、確認信息顯示在makefile中打印錯誤或警告信息 Bootstrap -- 插件: 提示工具、彈出框、警告框消息【Bootstrap】一些提示信息插件 bootstrap tooltip 顯示提示信息 Jquery插件之信息彈出框showInfoDialog（成功、錯誤、警告、通知）【bootstrap】bootstrap可關閉警告框 Bootstrap警告框