Tabela básica:
<table> <tr> <td> nome de usuário </td> <td> senha </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </bit>
A adição de uma classe .table à tag <table> pode fornecer estilo básico, uma pequena quantidade de preenchimento e divisores horizontais.
O efeito de exibição é o seguinte:
Forma listrada:
Adicionando: class = "Table Table-triped" à tag da tabela pode adicionar listras de zebra a cada linha dentro do TBody
<table> <tr> <td> nome de usuário </td> <td> senha </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </bit>
O efeito de exibição é o seguinte:
Tabela com fronteiras:
Adicione class = "Table Table-Bordered" à tag de tabela para adicionar bordas a cada célula da tabela.
<table> <tr> <td> nome de usuário </td> <td> senha </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </bit>
O efeito de exibição é o seguinte:
Formulário de aperto:
Adicionar a classe .table-condensed pode tornar a tabela mais compacta e o preenchimento nas células será reduzido pela metade.
<table> <tr> <td> nome de usuário </td> <td> senha </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </bit>
O efeito de exibição é o seguinte:
Tabela responsiva:
Enrole qualquer elemento .table dentro do elemento .table-responsive e crie uma tabela responsiva que rola horizontalmente em um dispositivo de tela pequeno (menos de 768px). Quando a tela é maior que a largura de 768px, a barra de rolagem horizontal desaparece
<div> <table> <tr> <td> nome de usuário </td> <td> senha </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </tabela> </div>
O exposto acima é a descrição completa da sexta introdução ao estilo de formulário de bootstrap introduzida pelo editor. Espero que seja útil para todos. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a todos a tempo. Muito obrigado pelo seu apoio ao site wulin.com!