O grupo de botões também é um componente independente. O grupo de botões é o mesmo que o componente menu suspenso e precisa confiar no plug-in Button.js para funcionar normalmente.
Combine um grupo de <div> em um <div> para criar componentes mais complexos.
<div role = "Toolbar"> <div> <botão de botão = "Button"> 1 </button> <button type = "button"> 2 </button> <button type = "button"> 3 </button> <butter = "Button"> <//button> <butter type = "" "> 5 </</buttão ="> "> </button> <butt> <butt>" Tipo = ""> 5 </</<butt = ">"> </button> <butt> <butt> type = "Button"> 7 </button> <button type = "button"> 8 </button> </div> <div> <button type = "button"> 9 </button> </div> </div>
O menu suspenso Button parece apenas o menu suspenso. A única diferença entre eles é que o contêiner externo div.Dropdown é substituído pelo div.btn-group
<div> <button data-toggle = "suspenso"> menu suspenso Button <span> </span> </butut> <ul> <li> <a href = "#"> Lista de menus 1 </a> </li> <li> <a href = "#"> Lista de menu 2 </a> </li> <li> <ahref = "#"> HREF = "#"> Lista de menus 4 </a> </li> <li> <a href = "#"> Lista de menus 5 </a> </li> </ul> </div>
arquivo bootstrap.css
.btn-GROUP .Dropdown-Toggle: ativo, .btn-Group.open .Dropdown-Toggle {esboço: 0;}. Btn-Group> .btn + .Dropdown-Toggle {Right-Right: 8px; preenchimento-esquerda: 8PX;}. preenchimento-esquerda: 12px;}. Box-Shadow: Inserção 0 3px 5px rgba (0, 0, 0, .125);}. Box-Shadow: Nenhum;}O triângulo para cima para cima do botão
O triângulo descendente do botão é adicionando um elemento de tag span à tag de botão, e o nome da classe é .Caret
<Button data-toggle = "suspenso"> menu suspenso de botão <Blate> </span> </butut>
Esta forma de triângulo é implementada através do CSS. A seguir, o código -fonte do bootstrap.css:
.CARET {Display: Inline-Block; largura: 0; altura: 0; margem-esquerda: 2px; Alinhamento vertical: meio; Top de borda: 4px sólido; Direita-direita: 4px transparente sólido; Border-Ift: 4px Solid Transparent;}O exposto acima é tudo sobre este artigo, espero que seja útil para o aprendizado de todos.