CSS3 Navegación-un bello ejemplo de navegación CSS3 (1 / 3 paso)

Paso 1: Los códigos de HTML de la barra de navegación de CSS3

La barra de navegación esta CSS3 principalmente consta de dos partes: la parte del logo y la parte de elementos de menú.

-----------------------------------------------------------------------------------------------------------------------------------------------------------------
< div clase = "menú principal" >
< div clase = 'marca' >
< a href = '#' class = 'logo' > su insignia < /a >
< div clase = 'btn-grupo' >
< botón tipo = 'button' class = 'sign in' > firmar < / botón >< botón tipo = 'button' class = 'registro' > Registro < / botón >
< / div >
< div clase = 'campo de búsqueda' >
< tipo de entrada = marcador de posición de ' búsqueda' = 'Buscar' / >
< una clase = 'icono de la búsqueda' > s < /a >
< / div >
< / div >
< ul clase = 'nav clearfix' >
< li >< a href = '#' > NFL < /a >< /li >
< li >< a href = '#' > MBL < /a >< /li >
......
< li >
< a href = '#' > más < /a >
< ul clase = 'más deporte' >
< span clase = 'encabezado' > deportes < /span >
< li >
< a href = '#' > fútbol australiano < /a >
< a href = '#' > MSL < /a >
< a href = '#' > CFL < /a >
< a href = '#' > NCAA béisbol < /a >
< a href = '#' > grillo < /a >
< a href = '#' > Olimpiadas < /a >
< /li >
< li >
......
< /li >
< li >
......
< /li >
< span clase = 'footer' > última actualización: hoy, 28 de septiembre, hace < a href = '#' > todos los deportes < /a >< / span >
< /ul >
< /li >
< /ul >
< / div >
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Artículos Relacionados

Cómo trabajar con tela conductora

Cómo trabajar con tela conductora

Trabajo con tela conductora es divertido y es ideal para accesorios personales, circuitos suave, e-textiles y otros proyectos que se aprovechan de sus propiedades. Aprender los conceptos básicos te ayudará a tomar decisiones de diseño y material a la
Lámpara de escritorio flotantes de brazo de Steampunk

Lámpara de escritorio flotantes de brazo de Steampunk

http://www.youtube.com/watch?v=AvsyH4dtlTEComo muchos de mis proyectos esta comenzó con el hallazgo de la posibilidad de un recipiente de latón antiguo precioso en una tienda de segunda mano. Lo pagué un dólar y salí pensando "me encanta la pátina -
Andador dinámico pasivo accionado

Andador dinámico pasivo accionado

Un robot andante es todavía un reto. Científico y los fabricantes propusieron robots basan en caminar estático (el centro de masas es siempre sobre el centro de presión), pero este tipo de marcha es muy lenta.Poca dinámica podría obtenerse utilizando
Las matemáticas y el arte en Origami - como hacer tramas geométricas

Las matemáticas y el arte en Origami - como hacer tramas geométricas

Nunca estaba intrigado por origami hasta que me topé con origami modular. Yo he doblado por algunos años ahora, y mientras no estoy todavía ningún maestro de este arte, quiero compartir al menos una parte de ella con otros. El origami es un bello eje
Pesos de mantel de puño de mono

Pesos de mantel de puño de mono

Fuertes ráfagas y ráfagas de viento pueden ser una molestia en el picnic de verano agradable o entretenimientos al aire libre. Una solución fácil y elegante es colgar pesas en el borde de un mantel para mantenerlo intacto. Aquí es cómo utilizar nudo
Reciclado plástico bandolera o cartera

Reciclado plástico bandolera o cartera

No es necesario coser!Puede utilizar una plancha para fusionar bolsas de supermercado en una lámina gruesa de plástico.Entonces puede usar ese plástico para hacer un durable, impermeable, reciclado y con estilo bandolera o cartera.He visto algunos gr
Sombra bastón navegación y gráfica de trayectorias solares.

Sombra bastón navegación y gráfica de trayectorias solares.

por tonytran2015 (Melbourne, Australia).En la década de 1950 algunos mapas tienen sus gráficos de trayectorias solares impresos junto a las brújulas rosas. Una gráfica de trayectorias solares ayuda a los usuarios del mapa (de cierta área algunos pequ
Navegación astronómica emergencia

Navegación astronómica emergencia

técnicas para ayudarle en su camino en situaciones donde no pueden utilizarse técnicas de navegación estándar y equipos.Paso 1: i. Aviso sobre el Copyright Solo estoy agregando esto para yo cubrir legalmente.Técnicas de navegación astronómica siguen
Desbloquear V7 navegación 1000 GPS

Desbloquear V7 navegación 1000 GPS

desbloquear el entorno de Windows CE en un dispositivo GPS V7 navegación 1000.El 1000 V7 es un grande, bajo costo ($300 CAN) y GPS portátil. Fuera de la caja, las características principales incluyen un sistema de navegación de MyGuide, un reproducto
Configuración del ratón para agilizar fichas navegación

Configuración del ratón para agilizar fichas navegación

le mostrará cómo configurar los botones del ratón para hacer más eficiente la navegación por pestañas. Con estas opciones que usted será capaz de moverse rápidamente entre las pestañas, crear nuevas pestañas, cerrar pestañas actuales y cerrar el webr
GoFly - parapente/muchos/deslizamiento altímetro-variómetro de su navegación para automóviles

GoFly - parapente/muchos/deslizamiento altímetro-variómetro de su navegación para automóviles

GoFly es un proyecto basado en PNA (dispositivos de navegación de coche con Windows CE), software de computadora de vuelo táctico LK8000 y variómetro (altímetro) externo de entrada basan en Arduino board y sensor de presión.¿Por qué?-Usted puede cons
Teclado con tecla de navegación

Teclado con tecla de navegación

Siendo un jugador de consola, fue duro formarme juego MAME y NES de un teclado. Así que me encontré con esta idea de añadir un joypad a mi teclado.Aquí está lo que zou necesita hacer esto:un viejo teclado de trabajoun joypad (utilicé un uno joypad de
Adaptación mapeo y navegación con iRobot Create

Adaptación mapeo y navegación con iRobot Create

este tutorial demostrará cómo hacer el mapeo y navegación con el iRobot Create para menos de $30! Y mejor aún, su diseño para ser un complemento fácil a tu robot ya existentes (robot mayordomo, alguien?).¿Por qué es cartografía útil? ¿Que siempre qui
Cómo construir un auto Robot de navegación

Cómo construir un auto Robot de navegación

este es un tutorial detallado de como realizar un robot a partir de cero y dándole la capacidad de navegar de forma autónoma en un ambiente desconocido.Se cubrirán todos los argumentos típicos involucrados en robótica: mecánica , electrónica y progra