Foros del Web » Creando para Internet » CSS »

Comparto Menu apple con pocas etiquetas

Estas en el tema de Comparto Menu apple con pocas etiquetas en el foro de CSS en Foros del Web. Puesto que en HTML5 se lleva la reducción de etiquetas he pensado que se podría hacer asi: http://jsfiddle.net/6RQ9H/6/ Vista previa Código HTML: <nav> <a href= ...
  #1 (permalink)  
Antiguo 30/01/2014, 08:27
 
Fecha de Ingreso: enero-2008
Mensajes: 577
Antigüedad: 14 años, 10 meses
Puntos: 9
Comparto Menu apple con pocas etiquetas

Puesto que en HTML5 se lleva la reducción de etiquetas he pensado que se podría hacer asi:

http://jsfiddle.net/6RQ9H/6/ Vista previa

Código HTML:
<nav>
    <a href="#enlace1.html">Enlace1</a>
    <a href="#enlace2.html">Enlace2</a>
    <a href="#enlace3.html">Enlace3</a>
    <a href="#enlace4.html">Enlace4</a>
    <a href="#enlace5.html">Enlace5</a>
</nav>
<!-- nav>a[href=enlace$.html]{Enlace$}*5  (En jsfiddle se hace igual que en SublimeText2) --> 
Cita:
nav {
background: linear-gradient(#686868, #545454 50%, #464646 50%, #595959);
border-spacing: 1px 0;
border-radius: 5px;
box-shadow: 0 4px 3px -3px black;
display: table;
overflow: hidden;
width: 100%;
}
a {
background: linear-gradient(#8b8b8b, #707070 50%, #5e5e5e 50%, #777777);
color: white;
display: table-cell;
font: 13px Tahoma, Arial, sans-serif;
line-height: 36px;
text-align: center;
text-decoration: none;
text-shadow: 0px -1px 0px #333333;
}
a:hover {
background-image:
linear-gradient( 90deg, rgba(255,255,255,.1), transparent 10px),
linear-gradient(270deg, rgba(255,255,255,.1), transparent 10px),
linear-gradient(#5d5d5d, #424242 50%, #383838 50%, #535353)
;

}
a:before {
background: linear-gradient(#9B9B9B, #868686 50%, #767676 50%, #8B8B8B);
content : '*';
float: left;
width: 1px;
}
a:after {
background: linear-gradient(#959595, #7F7F7F 50%, #6E6E6E 50%, #848484);
content : '*';
float: right;
width: 1px;
}
a:hover:before, a:hover:after {
background: none;
}

Etiquetas: background, color, etiquetas, hover, html
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 18:42.