En este artículo vamos a ver cómo alinear el contenido de tu blog o página, veremos como centrarlos o situarlos ya sea en el centro, derecha o izquierda.
La mayoría de las plantillas que utilizamos en blogger alinean el contenido por defecto hacia la izquierda, pero con unas líneas podemos modificarlo.
Haremos uso de un contenedor div al que asignaremos el atributo align, que determinará la alineación del elemento (imágenes, vídeos, texto...).
Alinear a la izquierda
Reemplaza en cada caso CODIGO DEL ELEMENTO por el código del elemento que deseas alinear, ya sea algo que se encuentre en un gadget o en una entrada.
Este código es muy importante a la hora de alinear contenido y supongo que es la forma más facil que hay, para alinear contenido de otras maneras, una forma sería con CSS:
Antes de seguir decir que los atributos align y valign en las imágenes están depreciados.
CSS vertical-align La propiedad vertical-align sirve para decir dónde se alineará el texto verticalmente respecto a la imagen. Admite los siguientes valores:
El DIV #contenedor es necesario para alinear el texto nuevamente a la izquierda, ya que en por la regla que dimos al body, el texto queda centrado.
Información Obtenida
Alinear contenido en el blog: elementos y gadgets
Alinear el contenido horizontal y verticalmente
Alinear el Texto con HTML
Otros Métodos
Centrar contenido con CSS
Centrar contenido de una página con CSS
La mayoría de las plantillas que utilizamos en blogger alinean el contenido por defecto hacia la izquierda, pero con unas líneas podemos modificarlo.
Haremos uso de un contenedor div al que asignaremos el atributo align, que determinará la alineación del elemento (imágenes, vídeos, texto...).
Centrado
[<div align="center"> CODIGO DEL ELEMENTO </div>]
Alinear a la izquierda
[ <div align="left"> CODIGO DEL ELEMENTO </div> ]
Alinear a la derecha
[ <div align="right"> CODIGO DEL ELEMENTO </div> ]
Reemplaza en cada caso CODIGO DEL ELEMENTO por el código del elemento que deseas alinear, ya sea algo que se encuentre en un gadget o en una entrada.
Este código es muy importante a la hora de alinear contenido y supongo que es la forma más facil que hay, para alinear contenido de otras maneras, una forma sería con CSS:
Antes de seguir decir que los atributos align y valign en las imágenes están depreciados.
CSS vertical-align La propiedad vertical-align sirve para decir dónde se alineará el texto verticalmente respecto a la imagen. Admite los siguientes valores:
length | Sube o baja el elemento el espacio indicado (por ejemplo en píxeles). Admite valores negativos. % | Sube o bajo el elemento el porcentaje indicado respecto a la propiedad "line-height". Admite valores negativos. baseline | Alinea el elemento con la línea base del elemento padre. Este es el valor por defecto. sub | Alinea el elemento como si fuese un subíndice. super | Alinea el elemento como si fuese un superíndice. top El punto alto de un elemento es alineado con el punto más de otro elemento en la línea. text-top | El punto alto de un elemento es alineado con el punto alto de la fuente del elemento padre. middle | El elemento es puesto en la mitad del elemento padre. bottom | El punto bajo del elemento es alineado con el elemento más bajo en la línea. text-bottom | El punto bajo del elemento es alineado con el punto bajo de la fuente del elemento padre. inherit | Especifica que el valor de la propiedad vertical-align es heredada desde el elemento padre.
[<HTML> <head> <style type="text/css"> body{ text-align:center; margin:0 auto; } #contenedor{ margin: 0 auto; text-align:left; width:70%; } </style> </head> <body> <div id="contenedor"> el contenido de tu página acá </div> </body> </HTML> ]
El DIV #contenedor es necesario para alinear el texto nuevamente a la izquierda, ya que en por la regla que dimos al body, el texto queda centrado.
Información Obtenida
Otros Métodos
