Wie erstelle ich ein mehrstufiges Dropdown-Menü in Twitter Bootstrap 2?

Mehrstufiges Dropdown-Menü für Twitter Bootstrap 2

Das Erstellen eines mehrstufigen Dropdown-Menüs mit Elementen aus Twitter Bootstrap 2 erfordert eine benutzerdefinierte Implementierung.

Ursprüngliche Antwort Vor Version 2.1.1

Bootstrap 2 unterstützt nativ keine mehrstufigen Dropdowns. Um dies zu erreichen, können Sie zusätzliches CSS verwenden, um Untermenü-Dropdown-Menüs neben dem übergeordneten Menüelement zu positionieren.

.dropdown-menu .sub-menu {
  left: 100%;
  position: absolute;
  top: 0;
  visibility: hidden;
  margin-top: -1px;
}

.dropdown-menu li:hover .sub-menu {
  visibility: visible;
  display: block;
}

.navbar .sub-menu:before {
  /* Styling for the arrow pointer */
  border-bottom: 7px solid transparent;
  border-left: none;
  border-right: 7px solid rgba(0, 0, 0, 0.2);
  border-top: 7px solid transparent;
  left: -7px;
  top: 10px;
}

.navbar .sub-menu:after {
  /* Additional styling for the arrow pointer */
  border-top: 6px solid transparent;
  border-left: none;
  border-right: 6px solid #fff;
  border-bottom: 6px solid transparent;
  left: 10px;
  top: 11px;
  left: -6px;
}

Aktualisierte Antwort v2.1.1 und höher

Für Bootstrap In den Versionen 2.1.1 und höher sind standardmäßig Dropdown-Menüs mit mehreren Ebenen enthalten. Befolgen Sie einfach die Richtlinien in der Dokumentation:

[Bootstrap Multilevel Dropdown Documentation](https://getbootstrap.com/docs/2.3.2/components/#dropdowns)

Das obige ist der detaillierte Inhalt vonWie erstelle ich ein mehrstufiges Dropdown-Menü in Twitter Bootstrap 2?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!