Un Viaje
a las Estrellas
Donde las Galaxias rigen tu Destino
Lorem fistrum por la gloria de mi madre esse jarl aliqua llevame al sircoo. De la pradera ullamco qué dise usteer está la cosa muy malar.
Lorem fistrum por la gloria de mi madre esse jarl aliqua llevame al sircoo. De la pradera ullamco qué dise usteer está la cosa muy malar. Lorem fistrum por la gloria de mi madre esse jarl aliqua llevame al sircoo. De la pradera ullamco qué dise usteer está la cosa muy malar.Lorem fistrum por la gloria de mi madre esse jarl aliqua llevame al sircoo. De la pradera ullamco qué dise usteer está la cosa muy malar.Lorem fistrum por la gloria de mi madre esse jarl aliqua llevame al sircoo. De la pradera ullamco qué dise usteer está la cosa muy malar.Lorem fistrum por la gloria de mi madre esse jarl aliqua llevame al sircoo. De la pradera ullamco qué dise usteer está la cosa muy malar.Lorem fistrum por la gloria de mi madre esse jarl aliqua llevame al sircoo. De la pradera ullamco qué dise usteer está la cosa muy malar.Lorem fistrum por la gloria de mi madre esse jarl aliqua llevame al sircoo. De la pradera ullamco qué dise usteer está la cosa muy malar.
Normalmente nuestra Sección Hero la escogemos de una de las plantillas y añadimos fotos y textos. ¿Qué tal si hacemos algo diferente?
El efecto que vamos a lograr en este tutorial nos ofrece una elegante y poco usada manera de fundir nuestra Sección Hero con nuestra página al hacer scrolling o desplazarnos hacia abajo.
Lo primero que haremos es añadir una sección a nuestra página a la que asignaremos una altura vertical de 100 utilizando el parámetro VH.
Para ello en Disposición seleccionamos en «Alto» Altura Mínima y en «Altura Mínima» escogemos VH personalizándola a 100. Es importante esta personalización. Por lo general se escoge Ajustar a la Pantalla.
Vayamos a nuestra Sección y en Estilo escogemos la imagen que usaremos de fondo, la que personalizaremos Centro Centro en «Posición», Fijo en «Adjunto», No Repetir en «Repetir», y Abarcar en Tamaño.
Vayamos a nuestra Sección y en Estilo escogemos la imagen que usaremos de fondo, la que personalizaremos Centro Centro en «Posición», Fijo en «Adjunto», No Repetir en «Repetir», y Abarcar en Tamaño.
Aún en Estilo, activamos los Efectos de Desplazamiento -Scrolling Effects y escogemos Transparencia. E nuestro caso utilizamos los parámetros que muestra la imagen, mas vas a tener que jugar con ellos para lograr que la parte superior se desvanezca.
Ahora vamos a escoger Enfoque -Blur- y lo configuramos a nuestro gusto y antojo. Vuelvo a repetir que tendrás que jugar con ellos para lograr el efecto que desees. No necesariamente tiene que ser igual a este.
Por último vamos a ampliar y escogemos el que desees: reducir o ampliar y jugamos con los parámetros hasta encontrar el que satisfaga nuestro gusto. Utiliza los parámetros dados como punto de partida
Es momento de añadir un Titular a nuestra Sección. Así que en Disposición, en Posición de la Columna seleccionamos Abajo y añadimos el widget de Encabezado, el que personalizamos con 80pxs abajo. Para el titular utilizamos Open Sans 87px y 900 de peso, y asignamos Blanco para el color.
Ahora vamos a agregar una sección con Ancho de Contenido de 700 donde añadiremos 2 widgets de Encabezado y uno de texto. El primer Widget de Encabezado será para el Titular que será configurado a Open Sans 87pxs con 900 de peso, y asignamos Negro para el color. el segundo y tercer widget los configuramos como deseemos.
Ya está listo. Publiquemos nuestro trabajo y veamos el efecto.