es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


Reveal.js: un marco para una asombrosa presentación en HTML

Las presentaciones son una excelente manera de transmitir información valiosa e importante . Ya sea por negocios, educación o marketing, debe crear diapositivas de presentación interesantes, informativas y atractivas. Se suele hacer en un escritorio o teléfono inteligente, pero también puede crearlo utilizando tecnología web. En esta publicación, les presentaré Reveal.js, un marco para hacer hermosas presentaciones en HTML de forma sencilla.

Reveal.js es un marco muy poderoso para crear presentaciones HTML, ya que tiene muchas características avanzadas. Con Reveal.js, puede crear una presentación que admita gestos móviles, como pellizcar y deslizar . También puede crear el contenido de la presentación con rebajas, o con editores visuales como Diapositivas, si no quiere ensuciar sus manos con el código. Incluso te proporciona algunas transiciones y temas hermosos y viene con una multitud de otras características para ayudarte.

Comenzando con Reveal

En esta publicación, lo guiaré a través de la implementación básica de Reveal.js. Comencemos por descargar la copia de este repositorio. El archivo descargado contiene las siguientes carpetas:

  • CSS : el estilo central
  • js : javascript dependencias
  • complemento : algunos componentes desarrollados como extensión Reveal.js
  • lib : todos los demás activos de terceros (JavaScript, CSS, fuentes)

Ahora llamaremos a todas las dependencias que necesitan ser incluidas. En la sección principal, llame al estilo principal y también al tema que desea usar (proporcione un id de "tema"). Los temas disponibles son: predeterminado, cielo, beige, simple, serif, noche, luna y solarizado. Para esta demostración, simplemente uso la predeterminada como sigue:

Y antes del final de body etiqueta body, incluya la siguiente javascript:

Marcado HTML

En esta guía, supongamos que crearemos tres diapositivas básicas usando algunos códigos HTML. Hay tres elementos principales para crear las diapositivas de presentación. Son:

,
y
.

En el

etiqueta es donde debe especificar el contenido de la diapositiva. La diapositiva predeterminada se mueve horizontalmente, si desea crear una diapositiva vertical, agregue fácilmente otra
dentro. Aquí está el ejemplo:

Esto es una diapositiva horizontal
Y esto es diapositiva vertical

En la primera diapositiva, pondremos la introducción. Vistas fragmentadas irán en el segundo y esto finalmente será seguido por una diapositiva de remate con una cita y un enlace interno dentro.

Para la introducción, voy a formatear el título con h1 y el subtítulo con h3 así:

Presentación Hongkiat

Hola, esta es una demostración para Reveal.js

Ahora para la segunda diapositiva, usaré algunas palabras para el fragmento. Para crear una vista fragmentada, deberá doblar la section como en la creación de la diapositiva vertical. Luego, incluya la subsección con una identificación de fragments y una clase de fragment en el elemento de contenido de esta manera:

Estoy fragmentado

¡Presiona la flecha siguiente para revelarme!

Soy el número uno

Y yo soy el número dos

¡Hey, no me olvides! Soy tercero.

Finalmente, para el final, quiero usar una cita popular de Eric Cantona. Solo envuelva la palabra con un

elemento para obtener un estilo de cita bonita. Y para vincular internamente a otra diapositiva, simplemente agregue a etiqueta a con el mapa del enlace deslizante. El siguiente es el resultado:

The Punchline

Esta es una de las frases muy populares de :

"Cuando las gaviotas siguen al arrastrero, es porque creen que las sardinas serán arrojadas al mar". Muchas gracias."

Haga clic para volver a la primera página.

Una vez que todo se ha unido, el último paso para que la presentación funcione es agregando la siguiente configuración:

Esas son las configuraciones básicas que necesitamos para la implementación básica. Aquí puede encontrar una lista completa de configuraciones y otras configuraciones avanzadas, como descuentos, notas, autodesplazamiento y más.

Ahora tenemos una diapositiva bonita para la presentación. Esta es la introducción:

Esta es nuestra vista fragmentada:

Y esta es la última diapositiva:

Conclusión

Con esta herramienta, puede crear una excelente presentación HTML dentro de su sitio. Puede encontrar algunos ejemplos de inspiración aquí. Comparado con otras impresionantes bibliotecas de presentaciones, como Impress.js, que se centra en su maravillosa animación de transición, Reveal en mi opinión todavía es mucho más poderoso en términos de características.

5 Mejor software de Home Theater y Media Center [Revisión]

5 Mejor software de Home Theater y Media Center [Revisión]

Si está esperando convertir su PC o TV de pantalla grande en un sistema de cine en casa de bajo costo o un servidor de películas, entonces tengo las mejores aplicaciones de medios gratuitas para su proyecto favorito. El software de Home Theater y Media Center permite a las personas almacenar, transmitir, administrar y disfrutar fotos, música y videos con amigos y familiares en la pantalla grande.Al

(Consejos de tecnología y diseño)

12 aplicaciones de Android para jugar juegos clásicos retro

12 aplicaciones de Android para jugar juegos clásicos retro

Super Mario, Outrun, Duck Hunt, Donkey Kong, etc. se encontraban entre los videojuegos más famosos e influyentes de todos los tiempos. Hubo momentos en que solíamos jugar estos juegos a través de consolas de juegos clásicos, sin embargo, estos juegos retro aún se pueden jugar solo con tu Android.Los

(Consejos de tecnología y diseño)