Recents in Beach

▷ Generar Tablas en formato HTML y demas formatos facil y rapido

Generar tablas en HTML siempre es algo bastante tedioso así conozcamos de código debido a que normalmente son un poco complejas de rellenar pero mas que todo por su estructura al momento de generarlas, esto realmente a mi siempre me a parecido tedioso pero con tablesgenerator.com nos ayuda a generarlas fácilmente sin tener que ir a buscar ningún programa siquiera.

Pero como un ejemplo es mejor que cualquier palabra déjenme mostrarle algunas de sus funciones, las cuales realmente me parecen sumamente interesante y útiles en muchísimos sentidos.

Tabla de Contenido
Tecniwao
Esta es una tabla
Sencilla Generada con
HTML
Table Generator

Generador de tablas HTML
Generador de Tablas HTML
Como ven es una tabla de contenido de lo mas sencilla, pues el código seria en html un poco mas complicado dado que para llegar a la simple tabla de arriba tendríamos que hacer el siguiente código

<table>
  <tr>
    <th>Tabla de Contenido</th>
    <th>Tecniwao</th>
  </tr>
  <tr>
    <td>Esta es una tabla</td>
    <td>Sencilla Generada con </td>
  </tr>
  <tr>
    <td>HTML</td>
    <td>Table Generator</td>
  </tr>
</table>

Como ven es mucho mas complicado viendo el código simplemente, por lo que de forma gráfica con TablesGenerator podemos hacerlo sumamente mas sencillo, la verdad hacer una tabla HTML no es necesariamente difícil ya que solo consta de etiquetas <tr> y <th> las cuales representan las columnas y las filas respectivamente, pero si queremos apresurar el paso es preferible tener una opción mas eficiente, sobretodo si lo que intentamos es escribir especificaciones que es donde personalmente mas las utilizo.

Como dato adicional antes de generar el código HTML podemos seleccionar si queremos que venga con CSS o no, por lo que si lo generamos con CSS el código cambia un poco, dado que se agregan los estilos y la tabla se vería de la siguiente manera

Tabla de Contenido Tecniwao
Esta es una tabla Sencilla Generada con
HTML Table Generator

Eso si como verán el código cambia bastante pero solo por que incluye los CSS el resto es lo mismo, acá lo tienen para que comparen con el de arriba

<style type="text/css">
.tg  {border-collapse:collapse;border-spacing:0;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:black;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:black;}
.tg .tg-0pky{border-color:inherit;text-align:left;vertical-align:top}
</style>
<table class="tg">
  <tr>
    <th class="tg-0pky">Tabla de Contenido</th>
    <th class="tg-0pky">Tecniwao</th>
  </tr>
  <tr>
    <td class="tg-0pky">Esta es una tabla</td>
    <td class="tg-0pky">Sencilla Generada con </td>
  </tr>
  <tr>
    <td class="tg-0pky">HTML</td>
    <td class="tg-0pky">Table Generator</td>
  </tr>
</table>

Si quieres hacer uso de este Generador de Tablas HTML acá te dejo el enlace dado que puede ser de suma utilidad.

Publicar un comentario

1 Comentarios