Tabla básica:
<Table> <tr> <TD> Nombre de usuario </td> <td> contraseña </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </table>
Agregar una clase .table Tabla a la etiqueta <table> puede darle un estilo básico, una pequeña cantidad de relleno y divisores horizontales.
El efecto de visualización es el siguiente:
Forma rayada:
Agregar: class = "tabla de tabla" a la etiqueta de la tabla puede agregar rayas de cebra a cada fila dentro del tbody
<Table> <tr> <TD> Nombre de usuario </td> <td> contraseña </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </table>
El efecto de visualización es el siguiente:
Mesa con bordes:
Agregue class = "Tabla Bordado en la tabla" a la etiqueta de la tabla para agregar bordes a cada celda de la tabla.
<Table> <tr> <TD> Nombre de usuario </td> <td> contraseña </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </table>
El efecto de visualización es el siguiente:
Forma de apriete:
Agregar la clase .table-condensed puede hacer que la tabla sea más compacta, y el relleno en las células se reducirá a la mitad.
<Table> <tr> <TD> Nombre de usuario </td> <td> contraseña </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </table>
El efecto de visualización es el siguiente:
Tabla receptiva:
Envuelva cualquier elemento .table dentro del elemento .table-responsive y cree una tabla receptiva que se desplaza horizontalmente en un dispositivo de pantalla pequeña (menos de 768px). Cuando la pantalla es mayor de 768px de ancho, la barra de desplazamiento horizontal desaparece
<Div> <TABLE> <tr> <TD> Nombre de usuario </td> <td> contraseña </td> </tr> <tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </table> </div>
Lo anterior es la descripción completa de la sexta introducción de estilo de formulario Bootstrap introducida por el editor. Espero que sea útil para todos. Si tiene alguna pregunta, déjame un mensaje y el editor responderá a todos a tiempo. ¡Muchas gracias por su apoyo al sitio web de Wulin.com!