So erstellen Sie eine Fehlermeldung im Bootstrap-Bootstrap-Tutorial-php.cn

So erstellen Sie eine Fehlermeldung im Bootstrap

藏色散人

Freigeben： 2020-11-30 16:29:51

Original

3018 Leute haben es durchsucht

So erstellen Sie eine Fehleraufforderung mit Bootstrap: Erstellen Sie zunächst eine HTML-Beispieldatei. Führen Sie dann Bootstrap.css, jquery.js und Bootstrap.js ein und erstellen Sie schließlich einen Bootstrap-Warnfehler.

So erstellen Sie eine Fehlermeldung im Bootstrap

Die Betriebsumgebung dieses Tutorials: Windows7-System, Bootstrap3-Version. Diese Methode ist für alle Computermarken geeignet.

Empfohlen: „Bootstrap-Video-Tutorial“

Bootstrap-Fehlerwarnmeldungsaufforderung

Bootstrap bietet Stile für eine erfolgreiche Ausführung, Warnungen und Fehlermeldungen.

Sie müssen die folgenden Dateien einführen, wenn Sie diese Funktion verwenden:

bootstrap.css

jquery.js (muss vor bootstrap.js platziert werden)

bootstrap.js (die offizielle Empfehlung ist die Einführung von bootstrap-alert.js)

Hauptsächlich verwendete Stile:

.span4
.alert(默认样式)
.alert alert-successs
.alert alert-error
.alert alert-info

Nach dem Login kopieren

Der Beispielcode lautet wie folgt folgt:

<!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>

Nach dem Login kopieren

Der Effekt ist wie im Bild gezeigt:

So erstellen Sie eine Fehlermeldung im Bootstrap

Das obige ist der detaillierte Inhalt vonSo erstellen Sie eine Fehlermeldung im Bootstrap. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!