<!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)