GroundWork CSS Framework HTML5 – 04 – Menú principal

Veamos en este videotutorial cómo crear el menú principal de nuestra aplicación con GroundWork CSS.

Tutorial GroundWork

Y si hasta ahora ya hemos visto cómo estrcturar nuestra aplicación y cómo crear botones y sliders, en esta ocación trataremos uno de los temas más importantes: la creación del menú principal en GroundWork CSS.

Puesta en marcha de GroundWork CSS

En el head

Dentro de la etiqueta <head></head> debemos poner el siguiente código que llama a algunos de los JavaScript y CSS necesarios:

<!-- Modernizr -->
<script src="/js/libs/modernizr-2.6.2.min.js"></script>
<!-- framework css -->
<!--[if gt IE 9]><!-->
<link type="text/css" rel="stylesheet" href="/css/groundwork.css">
<!--<![endif]-->
<!--[if lte IE 9]>
<link type="text/css" rel="stylesheet" href="/css/groundwork-core.css">
<link type="text/css" rel="stylesheet" href="/css/groundwork-type.css">
<link type="text/css" rel="stylesheet" href="/css/groundwork-ui.css">
<link type="text/css" rel="stylesheet" href="/css/groundwork-anim.css">
<link type="text/css" rel="stylesheet" href="/css/groundwork-ie.css">
<![endif]-->

En el footer

Antes de cerrar la etiqueta </body> debemos llamar a la librería jQuery y la de GroundWork:

<script type="text/javascript" src="/js/libs/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="/js/groundwork.all.js"></script>

Con esto deberíamos tener ya todo preparado para poder trabajar con el FrameWork HTML5. Lógicamente consideramos por descargada las librerías en las carpetas correspondientes.

Menú principal en GroundWorkCSS

Último de los cuatro vídeos del tutorial para la creación de páginas web responsive con el framework GroundWork CSS. En este caso vemos como crear el menú principal de la web, y que éste se adapte a todos los dispositivos.

Esperamos que este artículo os facilite la creación de Menú principal en vuestra aplicación web o móvil con el FrameWork HTML5 GroundWork CSS. Con los cuatro artículos sobre GroundWork, ya deberíamos tener lo básico para poder montar nuestra primera aplicación: Estructura, botones, sliders y menú principal.


Más información