miércoles, 1 de mayo de 2013

INSERTAR TABLA EN BLOGGER

Hoy vamos a ver como insertar una tabla en blogger, para ello lo vamos a hacer desde el HTML, si prestamos atención tenemos a nuestra izquierda dos botones, uno dice "Redactar" y otro "HTML", hacemos clic en "Redactar".
Una vez en el HTML, lo que recomiendo por su sencillez es copiar el HTML de una tabla que podemos hacer en algún editor  porque nos evitamos de escribir, sino la podemos escribir.

Bueno para una tabla de dos por dos los el código es el siguiente:

<table border="1" width="100%" id="table1">
<tr>
<td>hola</td>
<td>como</td>
</tr>
<tr>
<td>les </td>
<td>va</td>
</tr>
</table>

En el código anterior  vemos las partes: donde dice border="1" , es el ancho de las lineas de la tabla, si no queremos que se vea la tabla podemos poner cero y nos quedaría  border="0"
width es el ancho.
Id="table1" es el nombre de la tabla
yo recomiendo dejar estos dos últimos valores como están.

hola como
les va

En la anterior tabla vemos como nos queda la misma.
Si miramos un poquito la relación entre la tabla y el código, vemos como el código esta en dos bloques

si quisiéramos una tabla de 3 filas y dos columnas, tenemos que agregar un nuevo bloque

<tr>
<td>hola</td>
<td>como</td>
        </tr>
y si quisiéramos agregar mas columnas a cada estructura de <tr> tendríamos que agregarle una de <td>

para que nos sea mas fácil de entender acá pongo como quedaría una tabla de 3 filas y dos columnas

<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>

y una tabla de 2 filas y 3 columnas a continuación

<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

BUENO, SUPONGO QUE QUIZÁS PODES ESTAR UN POCO PERDIDO A ESTAS ALTURAS,
ASÍ QUE TE DEJO A CONTINUACIÓN ALGUNAS TABLAS PARA QUE COPIES Y PEGUES EN EL HTML DE TU BLOG.
RECORDA QUE LE VAS A TENER QUE CAMBIAR EL BORDE SI NO QUERES QUE SE VEA O QUE SEA MAS GRUESO EL TRAZO. ESCRIBÍ O PONELE FOTOS DESDE REDACTAR, QUE ES MAS FÁCIL.

Tabla de 1 fila y dos columnas

<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
Tabla de 1 fila y 3 columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
Tabla de 1 fila y 4 columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
Tabla de 2 fila y1columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
Tabla de 2 fila y2 columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
 Tabla de 2 fila y3 columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
 Tabla de 2 fila y 4 columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
 Tabla de 3 fila y 1 columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
Tabla de 3 fila y 2 columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
Tabla de 3 fila y 3 columnas
<table border="1" width="100%" id="table1">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

No hay comentarios:

Publicar un comentario