tablas

tablas html sin formato

tablas html con formato

tablas html empleando CSS

añadir tablas a las plantillas

ejemplo de tabla creada desde plantilla de entrada

Tiempo estimado:	10 minutos
Nivel:	medio

Hemos creado una tabla añadiendo codigo html a la plantilla de los posts

tablas html sin formato

OJO!!! Ninguna de las tablas que creemos se visualizarán como tales en la vista previa. Debemos fiarnos del aspecto de la pestaña de redactar

nota: el html no tiene ningun salto de linea, son para visualizar mejor el html:

Tabla de 3 columnas:

<table>
   <tr>
      <td>1ª Columna</td>
      <td>2ª Columna</td>
      <td>3ª Columna</td>
   </tr>
</table>

1ª Columna

2ª Columna

3ª Columna

OJO!!! si no añadimos propiedades, nadie diría que es una tabla...
SOLUCIÓN: añadir borde

<table border="1">
   <tr>
      <td>1ª Columna</td>
      <td>2ª Columna</td>
      <td>3ª Columna</td>
   </tr>
</table>

1ª Columna

2ª Columna

3ª Columna

Podemos tener casillas bajo nuestras columnas:

<table border="1">
   <tr>
      <td>1ª Columna</td>
      <td>2ª Columna</td>
      <td>3ª Columna</td>
   </tr>
   <tr>
      <td>Casilla bajo 1ª Columna = 1ª Columna de la 2ª fila</td>
      <td>Casilla bajo 2ª Columna = 2ª Columna de la 2ª fila</td>
      <td>Casilla bajo 3ª Columna = 3ª Columna de la 2ª fila</td>
   </tr>
</table>

1ª Columna	2ª Columna	3ª Columna
Casilla bajo 1ª Columna = 1ª Columna de la 2ª fila	Casilla bajo 2ª Columna = 2ª Columna de la 2ª fila	Casilla bajo 3ª Columna = 3ª Columna de la 2ª fila

Podemos resaltar los encabezados de columnas:

<table border="1">
   <tr>
      <th>1ª Columna</th>
      <th>2ª Columna</th>
      <th>3ª Columna</th>
   </tr>
   <tr>
      <td>Casilla bajo 1ª Columna = 1ª Columna de la 2ª fila</td>
      <td>Casilla bajo 2ª Columna = 2ª Columna de la 2ª fila</td>
      <td>Casilla bajo 3ª Columna = 3ª Columna de la 2ª fila</td>
   </tr>
</table>

1ª Columna	2ª Columna	3ª Columna
Casilla bajo 1ª Columna = 1ª Columna de la 2ª fila	Casilla bajo 2ª Columna = 2ª Columna de la 2ª fila	Casilla bajo 3ª Columna = 3ª Columna de la 2ª fila

Podemos poner un título que se ajuste al ancho de nuestra tabla:

<table border="1">
   <caption>Esta es una tabla de 2 filas x 3 columnas que va a contener estadísticas de visitas a mi blog</caption>
   <tr>
      <th>1ª Columna</th>
      <th>2ª Columna</th>
      <th>3ª Columna</th>
   </tr>
   <tr>
      <td>Casilla bajo 1ª Columna = 1ª Columna de la 2ª fila</td>
      <td>Casilla bajo 2ª Columna = 2ª Columna de la 2ª fila</td>
      <td>Casilla bajo 3ª Columna = 3ª Columna de la 2ª fila</td>
   </tr>
</table>

Esta es una tabla de 2 filas x 3 columnas que va a contener estadísticas de visitas a mi blog

1ª Columna	2ª Columna	3ª Columna
Casilla bajo 1ª Columna = 1ª Columna de la 2ª fila	Casilla bajo 2ª Columna = 2ª Columna de la 2ª fila	Casilla bajo 3ª Columna = 3ª Columna de la 2ª fila

<table border="1"><caption>Esta es una tabla de 2 filas x 3 columnas que va a contener estadísticas de visitas a mi blog</caption><tr><th>1ª Columna</th><th>2ª Columna</th><th>3ª Columna</th></tr><tr><td>Casilla bajo 1ª Columna = 1ª Columna de la 2ª fila</td><td>Casilla bajo 2ª Columna = 2ª Columna de la 2ª fila</td><td>Casilla bajo 3ª Columna = 3ª Columna de la 2ª fila</td></tr></table>


Ej: podemos crear una tabla para añadirla a la plantilla de entrada!!!!!

Tiempo estimado:	minutos
Nivel:	avanzado medio bajo

OJO con tener la tentación de poner cada etiqueta en una linea!!!!!
Pues nos encontraremos con muchas lineas en blanco antes de mostrar la misma:
<table border="1">
<tr>
<td>Tiempo estimado:</td>
<td>minutos</td>
</tr>
<tr>
<td>Nivel:</td>
<td>avanzado medio bajo</td>
</tr>
</table>

Tiempo estimado:	minutos
Nivel:	avanzado medio bajo

SOLUCIÓN: usar editores HTML para complicarnos un poco menos la vida.
Ej: pspad

aplicar estilos CSS

la clase crazytext en acción.

Esto es un cuadro con borde y relleno

Éste es un color horrible.

dar permisos

En las siguientes imágenes puede verse como convertir a un autor en administrador y como se visualiza en blogger la nueva situación:

NOTA: Si no se aprecian las imágenes, situarse sobre cada una de ellas, dar al botón derecho del ratón y escoger abrir vinculo en una ventana nueva

blog grupal

1. Crear el blog. Por ejemplo: sanadrian
2. Invitar a nuevo autoress. Tan solo necesitamos conocer su mail
3. Dar permisos a los autores con mucho ojo
4. Eliminar a los autores que ya no vayan a seguir participando en el blog cooperativo

eliminar a un autor

 

Existen 2 formas de eliminar a un autor de un blog:

 - el propio autor decide no seguir siéndolo

 - el administrador elimina al autor