ORGANIZAR CONTENIDOS EN TABLAS Y CUADROS DE TEXTO

ORGANIZAR CONTENIDOS EN TABLAS Y CUADROS DE TEXTO

Los contenidos de una página Wiki pueden estar organizados en Bloques de Texto que permita una mejor ubicación del texto como también de las imágenes.

Formatos de Colores

Para conocer sobre los colores que puedes aplicar visita la sección Formatos de Colores

(:description Guías para Bloques y Secciones:)
(:title Organizar Contenidos:)

► Ver ARTICULO MODELO con secciones?

(:div align=center style='align:center; border:4px dotted white; padding:10px; background-color:orange; width:450px':)
► Ver ARTICULO MODELO con Secciones de Texto?
(:divend:)

(:include Base/GuíaDeEstilos#ejemplos:)

(:include WikiEscuela/FormatoParaColores:)

ORGANIZAR CONTENIDOS EN BLOQUES
Guías para Bloques y Secciones
(:description Guías para Bloques y Secciones:)

Los contenidos de un Tema pueden estar organizados en Bloques de Texto que permita una mejor ubicación del texto como también de las imágenes.

En Red Escuela? puedes utilizar Areas de Contenido como ser Tablas, Marcos y Capas.

ORGANIZRA CONTENIDOS EN TABLAS
Una tabla es una estructura conformada por Filas y Columnas. A continuación se muestra cómo crear una tabla sencilla de 2 columnas y 3 filas:

Se escribe así:

(:table border=1 width=300px:)
(:cellnr:)
Fila 1 - Columna 1

(:cell:)
Fila 1 - Columna 2

(:cellnr:)
Fila 2 - Columna 1

(:cell:)
Fila 2 - Columna 2

(:cellnr:)
Fila 3 - Columna 1

(:cell:)
Fila 3 - Columna 2

(:tableend:)

Para que se vea así:

Las tablas pueden tener color de fondo para decorar su contenido:

Tabla con color de fondo

Se escribe así:

(:table border=1 width=400px bgcolor=lightblue:)
(:cellnr:)
TITULO 1

(:cell:)
TITULO 2

(:cellnr:)
Texto en primer columna

(:cell:)
Texto en segunda columna

(:cellnr:)
Texto en tercer fila

(:cell:)
Texto en tercer fila

(:tableend:)

Se pueden aplicar diferentes Bordes a la tabla:

Tabla con borde

Se escribe así:

(:table border=3 bordercolor='green'
width=400px bgcolor=lightgreen:)
(:cellnr:)
TITULO 1

(:cell:)
TITULO 2

(:cellnr:)
Texto en primer columna

(:cell:)
Texto en segunda columna

(:cellnr:)
Texto en tercer fila

(:cell:)
Texto en tercer fila

(:tableend:)

Aplicar color de Fondo a ciertas celdas:

Celdas con color

Se escribe así:

(:table border=1 width=400px :)
(:cellnr style='background-color:gold;':)
TITULO 1

(:cell style='background-color:gold;':)
TITULO 2

(:cellnr:)
Texto en primer columna

(:cell:)
Texto en segunda columna

(:cellnr:)
Texto en tercer fila

(:cell:)
Texto en tercer fila

(:tableend:)

ORGANIZAR CONTENIDOS EN RECUADROS
Para enmarcar algunas frases y utilizar bordes y recuadros:

(:table border=1 :)
(:cell style='padding:5px; background-color:#faffb7; ' width='300px' align='center' :)
Se escribe así:
(:cell style='padding:5px; background-color:#faffb7; ' width='300px' align='center' :)
Para que se vea así:

(:cellnr style='padding:5px;':)
Crear un texto en un Frame (marco)

>>frame<<

Este texto se encuentra
en un marco.

Aunque tenga varios 
párrafos igual seguirá 
dentro del marco.

>><<

(:cell style='padding:5px;':)

(:cellnr style='padding:5px;' align=left:)
Texto en Frame centrado

>>cframe width:'400px'<<
%gray%[-'''Texto para Citas'''-]

Este texto está en marco centrado
con un ancho de 400 pixeles

>><<

(:cell style='padding:5px;':)

(:cellnr style='padding:5px;' align=left:)
Texto en un DIV (capa)

(:div style='border:1px solid blue;
background-color:#ffffcc':)

Este texto esta en un DIV.
Puedes aplicarle colores de 
fondo y estilos de borde.

(:divend:)

(:cell style='padding:5px;':)
(:div style='border:1px solid blue; background-color:#ffffcc':)

Este texto esta en un DIV.
Puedes aplicarle colores de
fondo y estilos de borde.

(:divend:)

(:cellnr style='padding:5px;' align=left:)
Ejemplos de texto en DIV

(:div style='background-color:#ffddaa;
border:2px solid color=#ff8c00;width:300px;
padding:10px; margin-left:300px;':)

Este DIV tiene borde de 2 pixeles
de grosor color naranja con margen izquierdo
de 50 pixeles y margen interno de 10 px y
un ancho del cuadro de 300 pixeles. 

%center%Attach:escolares-small.gif

(:divend:)

(:cell style='padding:5px;':)
(:div style='background-color:#ffddaa; border:2px solid color=#ff8c00;width:300px; padding:10px; margin-left:50px;':)

Este DIV tiene borde de 2 pixeles
de grosor color naranja con margen izquierdo
de 50 pixeles y margen interno de 10 px y
un ancho del cuadro de 300 pixeles.

(:divend:)

(:cellnr style='padding:5px;' align=left:)
Mas ejemplos de DIV

(:div style='font-style:italic;
border:4px dotted green; padding:20px;
background-color:#c0ffb7 :)

Este texto esta en un DIV con borde punteado 
de 4 pixeles y con un margen interno de 20 px,

Se puede incluir

'''texto formateado'''

* Lista
-> Sangria

(:divend:)

(:cell style='padding:5px;':)
(:div style='font-style:italic; border:4px dotted green; padding:20px; background-color:#c0ffb7':)
Este texto esta en un DIV con borde punteado
de 4 pixeles y con un margen interno de 20 px,

Se puede incluir

texto formateado

• Lista

(:divend:)

(:tableend:)