HTML Bordes de mesa
Las Tablas HTML pueden tener bordes de diferentes estilos y formas.
Cómo agregar un borde
Cuando agregas un borde a una tabla, también agregas borde alrededor de cada celda de la tabla:
Para agregar un borde, use la propiedad CSS border en la table, th y td elementos:
Bordes de tabla colapsados
Para evitar tener bordes dobles como en el ejemplo anterior, establezca la propiedad CSS border-collapse en collapse.
Esto hará que los bordes colapsen en uno solo:
Estilo de bordes de mesa
Si establece un color de fondo para cada celda y le da al borde un color blanco (el mismo que el fondo del documento), obtendrá la impresión de un borde invisible:
Ejemplo
table, th, td {
border: 1px solid white;
border-collapse: collapse;
}
th, td {
background-color: #96D4D4;
}
Inténtalo tú mismo »
Bordes de mesa redonda
Con la propiedad border-radius, los bordes se redondean:
Omita el borde alrededor de la tabla omitiendo table del selector CSS:
Bordes de mesa punteados
Con la propiedad border-style, puede establecer la apariencia del borde.
Se permiten los siguientes valores:
dotteddashedsoliddoublegrooveridgeinsetoutsetnonehidden
Color del borde
Con la propiedad border-color, puede establecer el color del borde.
