Código de CSS - Menú Vertical Fijo CSS

Imágen de perfil

Menú Vertical Fijo CSSgráfica de visualizaciones


CSS

estrellaestrellaestrellaestrellaestrella(1)
Actualizado el 21 de Noviembre del 2016 por ScriptShow (Publicado el 19 de Noviembre del 2016)
2.022 visualizaciones desde el 19 de Noviembre del 2016. Una media de 28 por semana
Menú vertical de posición fija. Fue parte de un proyecto... Y, ha acabado en LWP por mención de Xve. En fin, aquí está.

menu-vertical


Espero sea útil.

Un saludo

Requerimientos

Un navegador web o dispositivo compatible.

1.0
estrellaestrellaestrellaestrellaestrella(1)

Actualizado el 23 de Noviembre del 2016 (Publicado el 19 de Noviembre del 2016)gráfica de visualizaciones de la versión: 1.0
2.023 visualizaciones desde el 19 de Noviembre del 2016. Una media de 28 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="viewport" content="width=device-width">
<title>Menu Vertical</title>
<style type="text/css">
* {
margin: 0px;
padding: 0px;
font: normal normal 20px/20px Verdana, Sans-serif;
color: #D4D4D4;
}
body {
background: #2E2E46;
}
:hover, :focus {
-webkit-transition: all 2s;
-moz-transition: all 2s;
-ms-transition: all 2s;
-o-transition: all 2s;
transition: all 2s;
border: none 0px;
}
small {
display: inline-block;
font-size: 10px;
}
#menu {
position: fixed;
top: 0px;
right: 40px;
width: auto;
height: 100%;
list-style: none;
line-height: 20px;
text-align: right;
border-right: 1px solid #D4D4D4;
}
#menu li a {
display: inline-block;
padding: 20px;
color: #D4D4D4;
text-decoration: undeline;
border-right: 4px solid transparent;
}
#menu li a:hover {
border-right: 4px solid #D4D4D4;
}
#menu li a:focus {
border-right: 4px solid #D4D4D4;
}
</style>
</head>
<body>
<ul id="menu">
<li><a href="javascript:void(0)">01<br /><small>2 k 1 0</small></a></li>
<li><a href="javascript:void(0)">02<br /><small>2 k 1 2</small></a></li>
<li><a href="javascript:void(0)">03<br /><small>2 k 1 4</small></a></li>
<li><a href="javascript:void(0)">04<br /><small>2 k 1 6</small></a></li>
</ul>
</body>
</html>



Comentarios sobre la versión: 1.0 (1)

Imágen de perfil
xve
21 de Noviembre del 2016
estrellaestrellaestrellaestrellaestrella
Me encanta este menú!!!! Muchas gracias!!!
Responder

Comentar la versión: 1.0

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios

http://lwp-l.com/s3759