Código de CSS - Top Menu Responsive

Filtrado por el tag: Mysql

<<>>

Pos: 3

Val: 571

Ha mantenido su posición en CSS (en relación al último mes)

Top Menu Responsive

CSS

(2)

Publicado el 4 de Octubre del 2016 por Scriptshow (141 códigos)

6.103 visualizaciones desde el 4 de Octubre del 2016

Un sencillo menú horizontal compatible con la mayoría de dispositivos y navegadores actuales.

Con muy pocas líneas de código, se pueden conseguir atractivos efectos.

Requerimientos

Para visualizar este código, se precisa un navegador web actualizado; un equipo de sobremesa o portátil; una tableta o un smartphone. Redimensiona la ventana del navegador para ver el efecto.

1.0
(2)

Publicado el 4 de Octubre del 2016

gráfica de visualizaciones de la versión: 1.0

6.104 visualizaciones desde el 4 de Octubre del 2016

<!DOCTYPE html>

<html>

<head>

<style>

* {

margin:0;

font:normal 16px/16px sans-serif;

a, a:link {

background-color:#FFFFFF;

color:gray;

border:1px solid #DDDDDD;

padding:8px;

margin:4px;

text-align:center;

text-decoration: none;

display:inline-block;

-webkit-transition: all .4s;

-moz-transition: all .4s;

-ms-transition: all .4s;

-o-transition: all .4s;

transition: all .4s;

a:hover, a:focus {

background-color:#DEDEDE;

color:#FFFFFF;

@media screen and (max-width: 480px) {

a:link {

display:block;

</style>

</head>

<body>

<a href="#" target="_self">Inicio</a>

<a href="#" target="_self">Galería</a>

<a href="#" target="_self">Contacto</a>

<a href="#" target="_self">Otros...</a>

</body>

</html>

Comentarios sobre la versión: 1.0 (2)

xve

5 de Octubre del 2016

Hola, esta muy bien el código, pero le falta esta linea en el <header> para que funcione en smartphones:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

Responder

ScriptShow

20 de Octubre del 2016

Gracias por el aporte.

Un saludo

Responder