Accordeon Horizontal
En este artículo vamos a hablar de un accordeon horizontal que solo emplea CSS y HTML para llevar a cabo su funcionalidad.
El código HTML es muy simple utilizando listas de la siguiente forma:
<div class="horizontalaccordion"> <ul> <li> <h3>Heading 1</h3> <div>Content For Panel 1.</div> </li> <li> <h3>Heading 2</h3> <div>Content For Panel 2.</div> </li> <li> <h3>Heading 3</h3> <div>Content For Panel 3.</div> </li> <li> <h3>Heading 4</h3> <div>Content For Panel 4</div> </li> </ul> </div>
Para ver el código CSS puedes acceder al ejemplo en funcionamiento y ver el código fuente de la página y acceder al archivo CSS que se llama en el <head>.
Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
Deja una respuesta