Web-Frontend
js-Tutorial
Detaillierte Erläuterung der Fähigkeiten der Bootstrap-Schaltfläche im Dropdown-Menü „component_javascript'.
Detaillierte Erläuterung der Fähigkeiten der Bootstrap-Schaltfläche im Dropdown-Menü „component_javascript'.
Die Schaltflächengruppe ist ebenso wie die Dropdown-Menükomponente eine unabhängige Komponente, um ordnungsgemäß zu funktionieren.
Kombinieren Sie eine Gruppe von
<div class="btn-toolbar" role="toolbar"> <div class="btn-group"> <button type="button" class="btn btn-default">1</button> <button type="button" class="btn btn-default">2</button> <button type="button" class="btn btn-default">3</button> <button type="button" class="btn btn-default">4</button> <button type="button" class="btn btn-default">5</button> <button type="button" class="btn btn-default">6</button> </div> <div class="btn-group"> <button type="button" class="btn btn-default">7</button> <button type="button" class="btn btn-default">8</button> </div> <div class="btn-group"> <button type="button" class="btn btn-default">9</button> </div> </div>
Schaltflächen-Dropdown-Menüs ähneln grundsätzlich dem Aussehen von Dropdown-Menüs. Der einzige Unterschied zwischen ihnen besteht darin, dass der äußere Container div.dropdown durch div.btn-group
ersetzt wird<div class="btn-group"> <button class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 按钮下拉菜单 <span class="caret"></span> </button> <ul class="dropdown-menu"> <li><a href="#">菜单列表1</a></li> <li><a href="#">菜单列表2</a></li> <li><a href="#">菜单列表3</a></li> <li><a href="#">菜单列表4</a></li> <li><a href="#">菜单列表5</a></li> </ul> </div>
bootstrap.css-Datei
.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
outline: 0;
}
.btn-group > .btn + .dropdown-toggle {
padding-right: 8px;
padding-left: 8px;
}
.btn-group > .btn-lg + .dropdown-toggle {
padding-right: 12px;
padding-left: 12px;
}
.btn-group.open .dropdown-toggle {
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}
.btn-group.open .dropdown-toggle.btn-link {
-webkit-box-shadow: none;
box-shadow: none;
}
Nach unten gerichtetes Dreieck der Schaltfläche
Das nach unten gerichtete Dreieck der Schaltfläche wird durch Hinzufügen eines Span-Tag-Elements zum Schaltflächen-Tag erstellt. Der Klassenname lautet .caret
<button class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 按钮下拉菜单 <span class="caret"></span> </button>
Diese Dreiecksform wird über CSS implementiert. Das Folgende ist der Bootstrap.css-Quellcode:
.caret {
display: inline-block;
width: 0;
height: 0;
margin-left: 2px;
vertical-align: middle;
border-top: 4px solid;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
}
Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein.
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
So führen Sie Bootstrap in Eclipse ein
Apr 05, 2024 am 02:30 AM
Führen Sie Bootstrap in Eclipse in fünf Schritten ein: Laden Sie die Bootstrap-Datei herunter und entpacken Sie sie. Importieren Sie den Bootstrap-Ordner in das Projekt. Bootstrap-Abhängigkeit hinzufügen. Laden Sie Bootstrap CSS und JS in HTML-Dateien. Beginnen Sie mit der Verwendung von Bootstrap, um Ihre Benutzeroberfläche zu verbessern.
Warum startet mein Laptop nicht, nachdem ich den Netzschalter gedrückt habe?
Mar 10, 2024 am 09:31 AM
Es kann mehrere Gründe dafür geben, dass Ihr Windows-Laptop nicht startet. Speicherfehler, leerer Akku, defekter Netzschalter oder Hardwareprobleme sind häufige Ursachen. Hier sind einige Lösungen, die Ihnen bei der Lösung dieses Problems helfen. Laptop lässt sich nach Drücken des Netzschalters nicht einschalten Wenn sich Ihr Windows-Laptop nach Drücken des Netzschalters immer noch nicht einschalten lässt, können Sie mit den folgenden Schritten das Problem beheben: Ist Ihr Laptop vollständig aufgeladen? Führen Sie einen Hard-Reset durch, um Ihren Laptop zu reinigen. Setzen Sie den Speicher neu ein. Transparenter CMOS-Akku. Bringen Sie Ihren Laptop zur Reparatur. 1] Ist Ihr Laptop vollständig aufgeladen? Überprüfen Sie zunächst, ob Ihr Laptop vollständig aufgeladen ist. Laptop startet nicht, wenn der Akku leer ist
So lesen Sie die Ergebnisse des Bootstrap-Mediation-Effekt-Tests in Stata
Apr 05, 2024 am 01:48 AM
Interpretationsschritte des Bootstrap-Mediationseffekttests in Stata: Überprüfen Sie das Vorzeichen des Koeffizienten: Bestimmen Sie die positive oder negative Richtung des Mediationseffekts. Test-p-Wert: weniger als 0,05 zeigt an, dass die vermittelnde Wirkung signifikant ist. Überprüfen Sie die Konfidenzintervalle: Wenn sie nicht Null enthalten, bedeutet dies, dass der Mediationseffekt signifikant ist. Ein Vergleich des mittleren p-Werts: weniger als 0,05 untermauert die Bedeutung des Mediationseffekts zusätzlich.
Nach 750.000 Runden Einzelkampf zwischen großen Modellen gewann GPT-4 die Meisterschaft und Llama 3 belegte den fünften Platz
Apr 23, 2024 pm 03:28 PM
Zu Llama3 wurden neue Testergebnisse veröffentlicht – die große Modellbewertungs-Community LMSYS veröffentlichte eine große Modell-Rangliste, die Llama3 auf dem fünften Platz belegte und mit GPT-4 den ersten Platz in der englischen Kategorie belegte. Das Bild unterscheidet sich von anderen Benchmarks. Diese Liste basiert auf Einzelkämpfen zwischen Modellen, und die Bewerter aus dem gesamten Netzwerk machen ihre eigenen Vorschläge und Bewertungen. Am Ende belegte Llama3 den fünften Platz auf der Liste, gefolgt von drei verschiedenen Versionen von GPT-4 und Claude3 Super Cup Opus. In der englischen Einzelliste überholte Llama3 Claude und punktgleich mit GPT-4. Über dieses Ergebnis war Metas Chefwissenschaftler LeCun sehr erfreut und leitete den Tweet weiter
So führen Sie eine Idee in Bootstrap ein
Apr 05, 2024 am 02:33 AM
Schritte zur Einführung von Bootstrap in IntelliJ IDEA: Erstellen Sie ein neues Projekt und wählen Sie „Webanwendung“. Fügen Sie die Maven-Abhängigkeit „Bootstrap“ hinzu. Erstellen Sie eine HTML-Datei und fügen Sie Bootstrap-Referenzen hinzu. Ersetzen Sie ihn durch den tatsächlichen Pfad zur Bootstrap-CSS-Datei. Führen Sie die HTML-Datei aus, um Bootstrap-Stile zu verwenden. Tipp: Sie können ein CDN verwenden, um Bootstrap zu importieren oder HTML-Dateivorlagen anzupassen.
So lösen Sie das Problem nicht reagierender Schaltflächen im IE-Browser
Jan 30, 2024 am 10:48 AM
Was soll ich tun, wenn es keine Reaktion gibt, wenn der IE-Browser auf die Web-Schaltfläche klickt? Wenn beim Klicken auf den Web-Button keine Reaktion erfolgt, können wir dies in der Kompatibilitätsansicht festlegen! Wenn einige Freunde den IE-Browser verwenden, stellen sie fest, dass der Browser nicht reagiert, wenn sie auf die Schaltfläche auf der Webseite klicken. Auf diese Weise können wir die Funktionen der Webseite nicht nutzen Habe den IE-Browser unten zusammengestellt. Wie kann ich das Problem lösen, dass der Browser beim Klicken auf die Web-Schaltfläche nicht reagiert? Der IE-Browser reagiert nicht, wenn Sie auf die Web-Schaltfläche klicken. Lösung: 1. Öffnen Sie den IE-Browser, klicken Sie auf die Schaltfläche [Extras] in der Betriebsleiste und klicken Sie auf die Einstellungen für die [Kompatibilitätsansicht], wie in der Abbildung gezeigt. 2. Klicken Sie auf der Einstellungsseite [Kompatibilitätsansicht] rechts auf die Schaltfläche [Hinzufügen] und geben Sie die Website ein.
So verwenden Sie Bootstrap, um den Mediationseffekt zu testen
Apr 05, 2024 am 03:57 AM
Der Bootstrap-Test verwendet Resampling-Technologie, um die Zuverlässigkeit des statistischen Tests zu bewerten und die Signifikanz des Mediationseffekts zu beweisen: Berechnen Sie zunächst das Konfidenzintervall des direkten Effekts, des indirekten Effekts und des Mediationseffekts Mediationstyp nach der Baron- und Kenny- oder Sobel-Signifikanz und schließlich das Konfidenzintervall für den natürlichen indirekten Effekt schätzen.
So lesen Sie die Ergebnisse des Bootstrap-Mediation-Tests
Apr 05, 2024 am 03:30 AM
Der Bootstrap-Mediationstest bewertet den Mediationseffekt durch mehrfaches erneutes Abtasten der Daten: Konfidenzintervall für indirekte Effekte: Gibt den geschätzten Bereich des Mediationseffekts an. Wenn das Intervall nicht Null enthält, ist der Effekt signifikant. p-Wert: Bewertet die Wahrscheinlichkeit, dass das Konfidenzintervall nicht Null enthält, wobei Werte unter 0,05 auf Signifikanz hinweisen. Stichprobengröße: Die Anzahl der für die Analyse verwendeten Datenproben. Bootstrap-Unterabtastzeiten: die Anzahl der wiederholten Abtastungen (500–2000 Mal). Wenn das Konfidenzintervall nicht Null enthält und der p-Wert kleiner als 0,05 ist, ist der Mediationseffekt signifikant, was darauf hinweist, dass die vermittelnde Variable die Beziehung zwischen der unabhängigen und der abhängigen Variablen erklärt.
